Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

I have a list box where users can Add, Delete and Update and Save the list. Once clicked on the Save button I am doing a call to the jquery to build the array of elements in the list box and then doing a POST using a hidden INPUT elememt. But I am getting an empty array the PHP POST. Here is the jquery

$("#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;
    }
    $("#myCatgories").value(mylist);  
});

here is my html form

<form id="addcategory" method="post" action="index.php">
<div style="float: left">
    <input type="button" value="Add" id="addCategory" style="margin-left: 3px" />
        <input type="button" value="Update" id="updateCategory" style="margin-left: 3px" />
        <input type="button" value="Delete" id="deleteCategory" style="margin-left: 3px" />
        <br />                                            
        <input type="submit" value="Save" id="saveCategory" style="margin-left: 3px" />
    </div>
    <div>
    <input type="hidden" name="myCatgories[]" id="myCatgories" value="">
</div>

Can someone please tell me what I am doing wrong here and put in the right the direction.

Thanks

share|improve this question

2 Answers

up vote 0 down vote accepted

Try the code below (there was an issue with your array initialization), and .value() is not a proper jQ method, it should be .val()

$("#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;
    }
    $("#myCatgories").val(mylist);  
});

If this doesn't work, I suggest using console.log(mylist) and console.log(items) to make sure you are grabbing data and not empty fields.

share|improve this answer
I checked and getting the data. the problem is $("#myCatgories").value(mylist); it is giving this error .Value is not a function – Aamer Mar 27 at 19:42
TypeError: $(...).value is not a function $("#myCatgories").value(mylist); this is the complete error message getting on the console. – Aamer Mar 27 at 19:58
I change it to $('#myCatgories').value = mylist; error gone but still empty array in the POST. Any comments – Aamer Mar 27 at 20:26
@Aamer apologies, I forgot to make the most important correction, to your line of code calling the nonexistent .value() method. See my edit for updated code that should work (if not, add a console.log('#myCategories: ' + $('#myCategories').val() at the end of the script to confirm the problem is with the POST and not with the JS. – Moses Mar 27 at 22:22
many thanks for the correction. Got it right after some modification. Post the corrected code – Aamer Mar 28 at 0:54
up vote 0 down vote

change your input type from submit to button and on its click event ... sumit the form by using submit()

try this

HTML

<input type="button" value="Save" id="saveCategory" style="margin-left: 3px" />

Jquery

$("#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;
  }
  $("#myCatgories").val(mylist);
  $('#addcategory').submit(); //<-- submit you form here
});
share|improve this answer
I'm not sure why you would need to change it from submit to button. The onclick JS will execute first regardless of input type, and if you don't want to submit the form due to an error, you can always return false;. Is there something I am missing here? – Moses Mar 27 at 18:31
I changed as you mentioned by still getting an empty array in the POST. Also had to change second last line to $('#myCatgories').value = mylist; to get rid of the error – Aamer Mar 27 at 20:27

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.