当值被POST时，jQuery setTimeout刷新

Question

Previously i was sending values through GET from onChange of select dropdown

<select name="addSel" id="addSel" onChange="addFunc(this.value);">
    <option></option> ....  <option></option>
</select>

and in my javascript

function addFunc(val)
{
   document.location = 'index.php?action=live&sub=add';
}

I could possibly refresh my HTML table with the condition sub=add and table contents dependant on sub=add

function refTbl()
{
    var pathtopage = window.location.href;
    $('#TableId').load(pathtopage + ' #TableId', function(){
        setTimeout(refTbl, 10000);
    });
}

Then i wrapped my select inside <form> to send values through POST

<form id="selForm" name="selForm" action="" method="POST">
  <select name="addSel" id="addSel" onchange="this.form.submit()">
        <option></option> ....  <option></option>
  </select>
</form>

My url remains index.php?action=live and cant able to refresh my table based on posted values

function refTbl()
{
    var pathtopage = 'index.php?action=live';
    $('#TableId').load(pathtopage + ' #TableId', function(){
         setTimeout(refTbl, 10000);
    });
}

This doesn't refresh my table based on values from POST through select onChange. how it is possible to refresh my HTML table using setTimeout based on POST values.

p.s - I dont want to use AJAX

Answer 1

jQuery .load() second optional parameter is data. Send your form data with this.

You have to serialize your form data.

function refTbl(e)
{
    // Prevent form reloading page
    e.preventDefault();
    var pathtopage = 'index.php?action=live';
    var data = $(this).serializeArray();
    $('#TableId').load(pathtopage + ' #TableId', data, function(){
         setTimeout(refTbl, 10000);
    });
}

And call it on form submit

$("#selForm").submit(refTbl);