Untitled Application MyApp Author name 1.0 Apple iPhone 6 Plus False 414 736 False False False WebApp False C:\Users\ronni\OneDrive\Documents\VisualNeoWeb\Libraries\img\default-icon.png en #000000 [AndroidOS,iOS,WindowsPhoneOS] normal True True False True True False False True False False ... align top of pages with top of Browser Content Area; DO NOT ALTER TopCenterApp ... add any project start-up commands below .First we need to create an empty array to store the data CreateEmptyArray [mydata] .Then we populate the array with data .double click on any command to bring up the code wizard and better understand what's happening. .id field has a unique value per row .Loop 0 2 [idnumber] . neoTableSetData [mydata] [idnumber] "id" [idnumber] .EndLoop .first row neoTableSetData [mydata] 0 "id" 0 neoTableSetData [mydata] 0 "name" "John Lennon" neoTableSetData [mydata] 0 "gender" "M" neoTableSetData [mydata] 0 "dob" "09/10/1940" .second row neoTableSetData [mydata] 1 "id" 1 neoTableSetData [mydata] 1 "name" "Walt Disney" neoTableSetData [mydata] 1 "gender" "M" neoTableSetData [mydata] 1 "dob" "05/12/1901" .third row neoTableSetData [mydata] 2 "id" 2 neoTableSetData [mydata] 2 "name" "Steve Jobs" neoTableSetData [mydata] 2 "gender" "M" neoTableSetData [mydata] 2 "dob" "24/02/1955" ... log this event If [currentLoggedEventsObject] != "" GetObjectHTML "[currentLoggedEventsObject]" [currentEventData] SetVar [thisEventData] "[neoTableEvent]: " If [neoTableEvent] == "click" SetVar [thisEventData] "[thisEventData][neoTableField]" StringifyJSON [neoTableRow] [neoTableRowString] SetVar [thisEventData] "[thisEventData]<br/>[neoTableRowString]" EndIf If [neoTableEvent] == "pagechange" SetVar [thisEventData] "[thisEventData][neoTablePage]" EndIf If [neoTableEvent] == "search" SetVar [thisEventData] "[thisEventData][neoTableSearch]" EndIf SetObjectHTML "[currentLoggedEventsObject]" "[currentEventData]<br/>[thisEventData]" EndIf SetVar "[currentLoggedEventsObject]" "ViewsLoggedEventsInfo" 102px 20px 86px 30px Load Data warning .retrieve data stored in LocalStorage neoGetItem "mylist" [myitems2] "" ParseJSON "[myitems2]" [mydata] .retrieve deleted IDs neoGetItem "myListIDGone" [myitems1] "" ParseJSON "[myitems1]" [mydataDel] ... Reset any previous column definitions neoTableResetColumns "ViewsContainer" ... setup columns; IMPORTANT: column numbers MUST start at 1 neoTableSetColumn "ViewsContainer" 1 "id" "ID" "20px" false false true "" neoTableSetColumn "ViewsContainer" 2 "name" "Name" "80px" true false true "" neoTableSetColumn "ViewsContainer" 3 "gender" "Gender" "10px" false false true "" neoTableSetColumn "ViewsContainer" 4 "dob" "Birthday" "30px" false false true "" ... define user permissions neoTableInitTable "ViewsContainer" "" 0 "Table" false true false false false "eventManager" ... load Data neoTableLoadData "ViewsContainer" [mydata] neoTableHideColumn "ViewsContainer" "id" . retrieve total rows ArrayLen [mydata] [totalRows] .We want the search field to stay there but not visible at all. .So we make it tiny, and without borders. BeginJS $("#ViewsContainer input[type=text]").css("height","1px"); $("#ViewsContainer input[type=text]").css("width","1px"); $("#ViewsContainer input[type=text]").css("padding","0px"); $("#ViewsContainer input[type=text]").css("border","0px solid rgba(0,0,0,0"); EndJS 301px 129px 88px 28px Toggle View neoTableToggleView "ViewsContainer" 7px 20px 80px 30px new success . This demo is adpted from the neoTableTutorialPart1.neoapp demo ... Reset any previous column definitions neoTableResetColumns "ViewsContainer" ... setup columns; IMPORTANT: column numbers MUST start at 1 neoTableSetColumn "ViewsContainer" 1 "id" "ID" "20px" false false true "" neoTableSetColumn "ViewsContainer" 2 "name" "Name" "80px" true false true "" neoTableSetColumn "ViewsContainer" 3 "gender" "Gender" "10px" false false true "" neoTableSetColumn "ViewsContainer" 4 "dob" "Birthday" "30px" false false true "" ... define user permissions neoTableInitTable "ViewsContainer" "" 0 "Table" false true false false false "eventManager" ... load Data neoTableLoadData "ViewsContainer" [mydata] neoTableHideColumn "ViewsContainer" "id" . retrieve total rows ArrayLen [mydata] [totalRows] SetVar [mydataDel] "" . do remember to check on PROJECT > EVENT section for sample user data .We want the search field to stay there but not visible at all. .So we make it tiny, and without borders. BeginJS $("#ViewsContainer input[type=text]").css("height","1px"); $("#ViewsContainer input[type=text]").css("width","1px"); $("#ViewsContainer input[type=text]").css("padding","0px"); $("#ViewsContainer input[type=text]").css("border","0px solid rgba(0,0,0,0"); EndJS 5px 533px 399px 75px Selected data: <br>[neoTableRow] 103px 58px 85px 31px save . to save the current data to the LocalStorage, if need be StringifyJSON [mydata] [myitems2] neoSetItem "mylist" [myitems2] "" 6px 200px 400px 278px 0px 0px 385px 278px 212px 167px 80px 30px search BeginJS $("#ViewsContainer input[type=text]").val($App.search); $("#ViewsContainer input[type=text]").focus(); $("#TextInput1").focus(); EndJS 200px 55px 80px 30px delete danger StringifyJSON [neoTableRow] [s1] beginJS var obj = JSON.parse($App.s1); $App.selectedID = obj.id; endJS .jsalert "[selectedID]" .neoTableDeleteRowById "ViewsContainer" [selectedID] ArrayDelItem [mydata] [selectedID] .keep track of deleted IDs StringifyJSON [mydataDel] [myitems1] neoSetItem "myListIDGone" [myitems1] "" . now save the data StringifyJSON [mydata] [myitems2] neoSetItem "mylist" [myitems2] "" . reload the data neoGetItem "mylist" [myitems2] "" ParseJSON "[myitems2]" [mydata] .refresh updated data to table neoTableLoadData "ViewsContainer" [mydata] 222px 493px 163px 24px ID selected: [selectedID] 200px 20px 80px 30px insert primary . I tried adding strings like . {"name": "John Denver","gender": "M","dob": "31/12/1943"} . without success due to """ used. . Q1. Let me know how to set the strimgs correctly so that it's acceptable . ========== For now, using simple steps... =========== . Check for total row in the data ArrayLen [mydata] [totalRow] . as [totalRow] starts from 1 (and not 0), we can consider that as the next row counter neoTableSetData [mydata] [totalRow] "id" [totalRow] neoTableSetData [mydata] [totalRow] "name" "John Denver" neoTableSetData [mydata] [totalRow] "gender" "M" neoTableSetData [mydata] [totalRow] "dob" "31/12/1943" . best to put repeated codes like below in Subroutines... *) . now need to save the data to LocalStorage StringifyJSON [mydata] [myitems2] SetItem "mylist" [myitems2] . reload the data from LocalStorage neoGetItem "mylist" [myitems2] "" ParseJSON "[myitems2]" [mydata] .refresh updated data back to table neoTableLoadData "ViewsContainer" [mydata] 7px 493px 158px 19px Total Rows: [totalRows] 7px 61px 94px 47px click NEW for 1st time.Or to reset data stored in the device/browser's LocalStorage 7px 168px 200px 28px [search] Search user name . decided to put below command in the SEARCH button .BeginJS . $("#ViewsContainer input[type=text]").val($App.search); . $("#ViewsContainer input[type=text]").focus(); . $("#TextInput1").focus(); .EndJS 301px 167px 90px 30px reset list BeginJS $("#ViewsContainer input[type=text]").val(""); $("#ViewsContainer input[type=text]").focus(); $("#TextInput1").focus(); EndJS 0px 0px 414px 736px False