jQuery UI Widgets › Forums › Lists › ListBox › add item to json bound list
Tagged: jqwidgets listbox, ListBox
This topic contains 3 replies, has 2 voices, and was last updated by Peter Stoev 11 years, 5 months ago.
-
Author
-
I have a listbox that is bound to local json. I am new to Jq and have not been able to figure out how to add a new item
here is the json:
var DS_poitems = [
{
“batchrowid”:”6173″,
“batchOeehId”:”333″,
“batchLinenum”:”1″,
“linestatus”:”Added to Batch”,
“item”:”052000338775″,
“sxeprodid”:”tac110″,
“itemqyt”:”2″
},{
“batchrowid”:”6174″,
“batchOeehId”:”333″,
“batchLinenum”:”2″,
“linestatus”:”Added to Batch”,
“item”:”10000″,
“sxeprodid”:”tac0010f”,
“itemqyt”:”3″
},{
“batchrowid”:”6175″,
“batchOeehId”:”333″,
“batchLinenum”:”3″,
“linestatus”:”Added to Batch”,
“item”:”14″,
“sxeprodid”:”12c90″,
“itemqyt”:”4″
},{
“batchrowid”:”6176″,
“batchOeehId”:”333″,
“batchLinenum”:”4″,
“linestatus”:”Added to Batch”,
“item”:”1459″,
“sxeprodid”:”TAC007F5″,
“itemqyt”:”5″
},{
“batchrowid”:”6177″,
“batchOeehId”:”333″,
“batchLinenum”:”5″,
“linestatus”:”Added to Batch”,
“item”:”1460″,
“sxeprodid”:”DP40630″,
“itemqyt”:”3″
},{
“batchrowid”:”6178″,
“batchOeehId”:”333″,
“batchLinenum”:”6″,
“linestatus”:”Added to Batch”,
“item”:”1461″,
“sxeprodid”:”TAC0010F3IFC”,
“itemqyt”:”6″
},{
“batchrowid”:”6179″,
“batchOeehId”:”333″,
“batchLinenum”:”7″,
“linestatus”:”Added to Batch”,
“item”:”1462″,
“sxeprodid”:”TAC0010F”,
“itemqyt”:”3″
},{
“batchrowid”:”6180″,
“batchOeehId”:”333″,
“batchLinenum”:”8″,
“linestatus”:”Added to Batch”,
“item”:”1463″,
“sxeprodid”:”TAC0011F”,
“itemqyt”:”8″
},{
“batchrowid”:”6181″,
“batchOeehId”:”333″,
“batchLinenum”:”9″,
“linestatus”:”Added to Batch”,
“item”:”1465″,
“sxeprodid”:”TAC0015MSFIFC”,
“itemqyt”:”6″
}]Here is the listbox:
// prepare poitem the data
var srcPOItems =
{
datatype: “json”,
datafields: [
{ name: ‘batchrowid’, type: ‘number’ },
{ name: ‘batchOeehId’, type: ‘number’ },
{ name: ‘batchLinenum’, type: ‘number’ },
{ name: ‘linestatus’, type: ‘string’ },
{ name: ‘item’, type: ‘number’ },
{ name: ‘sxeprodid’, type: ‘string’ },
{ name: ‘itemqyt’, type: ‘number’ }
],
localdata: DS_poitems
};
var dA_POItems = new $.jqx.dataAdapter(srcPOItems);
// Create a jqxListBox
$(“#jqxWidget”).jqxListBox({ source: dA_POItems, displayMember: “sxeprodid”, valueMember: “batchrowid”, width: 200, height: 250, theme: theme });
$(“#jqxWidget”).on(‘select’, function (event) {
if (event.args) {
var item = event.args.item;
if (item) {
var valueelement = $(““);
valueelement.text(“Value: ” + item.value);
var labelelement = $(““);
labelelement.text(“Label: ” + item.label);$(“#selectionlog”).children().remove();
$(“#selectionlog”).append(labelelement);
$(“#selectionlog”).append(valueelement);
}
}
});//create addbutton
$(“#btnAdd”).jqxButton({ width: ‘150’, height: ’25’, theme: theme });
$(“#btnAdd”).bind(‘click’, function (event) {
var item = {
batchrowid: “1”,
batchOeehI: “333”,
batchLinenum: “100”,
linestatus: “Added to Batch”,
item: “New Freakin Item”,
sxeprodid: “SXE PROD NEW”,
itemqyt: “4”
};$(“#jqxWidget”).jqxListBox(“insertAt”, item, 1);
});
When the item is added I get [object Object]. How can I add a new item from Json?
Hi,
You can add new items that are “String” or Object with the following fields:
label – gets item’s label.
value – gets the item’s value.
disabled – gets whether the item is enabled/disabled.Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com/So if I use $(“#jqxWidget”).jqxListBox(“insertAt”, item, 1);
what would the var item statement look like.
In my example I have it set to json. not sure how I wouls et it for label value and disabled.
Also on the click event of the list I am able to get a column from the dataAdapter that is bound to the list but not shown in the list. Will I not be able to to this for items i add?
Hi,
var item should be an Object like: {label: “My Text”, value: “My Value”}
To get the items displayed in the ListBox, you may use the “getItems” method.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com/ -
AuthorPosts
You must be logged in to reply to this topic.