How to post back listbox

[AamerMember]

I am new to web development and like you tools for their ease of use. How can I post back the complete list in the listbox. I am trying to build on the “bind_listbox_to_mysql_database” example using json. I am using Oracle instead of mysql and successfully added the Add, Update and Delete options. But now need to save the changes to the database. The example only post back the selected option but I need the complete list.

Thanks in advance.

[Peter StoevKeymaster]

Hi Aamer,

To postback all items, you will have to do that manually with Ajax. You can get all ListBox items by using its “getItems”method which returns an Array of Objects.

Here’s the description about the ListBox’s getItems method.

Gets all items. The returned value is an array of Items.
Each item represents an Object with the following fields. 
Item Fields
label - gets item's label.
value - gets the item's value.
disabled - gets whether the item is enabled/disabled.
checked - gets whether the item is checked/unchecked.
hasThreeStates - determines whether the item's checkbox supports three states.
html - gets the item's display html. This can be used instead of label.
index - gets the item's index.
group - gets the item's group.
Code example
Invoke the getItems method.
var items = $("#jqxListBox").jqxListBox('getItems'); 
Get the first item.
var items = $("#jqxListBox").jqxListBox('getItems'); var firstItem = items[0]; 

By having all items, you can build a string using the label or value of each item. Then you can submit that string either with a hidden input in your form or by using the jQuery’s AJAX function.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[AamerMember]

Hi Peter,

Thanks for the quick response. I was able to build the array but struggling it in submitting using a hidden input.

here is java script code

$(“#saveCategory”).jqxButton();
$(“#saveCategory”).click (function() {
var items = $(“#jqxlistbox”).jqxListBox(‘getItems’);
var length = items.length;
var mylist = new Array();
for (var i = 0; i < length; i++) {
var row = {};
row["cname"] = items[i].value;
row["cvalue"] – items[i].label;
mylist[i] = row;
}

here is html

how can I link it

Thanks

[AamerMember]

here is the html. I don’t know what happened witht the orginal one

Thanks

[AamerMember]

“

“

[AamerMember]

I was able to write the function. Here is the code

$(“#saveCategory”).click (function() {
var items = $(“#jqxlistbox”).jqxListBox(‘getItems’);
var length = items.length;
var mylist = [];
for (var i = 0; i < length; i++) {
var row = [];
row["cname"] = items[i].value;
row["cvalue"] = items[i].label;
mylist[i] = row;
}
console.log(mylist);
//console.log(mylist);
$('#myCatgories').value = mylist;
});

here is the HTML

<div><input type="hidden" name="myCatgories[]" id="myCatgories"></div>

I checked on the console and data is there but there is empty array in the POST. What am I doing wrong?

Thanks

[Author]

Posts