Getting a default value from dropdown and display a table

Question

I am trying to display a HTML table in my index.php page with user registration data which process in table.php page. I am sending a value from a dropdown to the server for processing the data. These everything working for me. But my problem is when my index page load it is not display my table. If I need to display the table I want to select a value from the dropdown.

So anybody tell me how can I make a default value for dropdown (example 05) to display table when page is always loading.

This is my Jquery :

$('#filter-value').change(function(){
    var filterValue = $(this).val();
    //console.log(filterValue); 

    $.ajax({
        type: 'post',
        url: 'table.php',
        dataType: 'html',
        data: {filter: filterValue},
        success:function(data){ 
            $('#response').html(data);
            //alert(data); 
        }, 
        error:function (xhr, ajaxOptions, thrownError){
            //On error, we alert user
            alert(thrownError);
        }, 
        complete: function(){
            //alert('update success'); 
        }
    });
});

This is HTML

<div id="manage_user">
    <form action="" method="">
        <div id="response"></div>
        <button id="FormSubmit">Add New User</button>
    </form>
</div>

<br />
<div style="margin: 0 20px 20px;">
    <form method="post" action="">
        <select id="filter-value" name="filter">
            <option value="5">5</option>
            <option value="10">10</option>
            <option value="20">20</option>
            <option value="30">30</option>              
        </select>
    </form>
</div>

Thank you.

Why don't you try: <option value=5 selected>5<option> Then 5 will become the default. — EduardoSaverin
– EduardoSaverin, Commented Jun 30, 2013 at 2:52

j08691 · Accepted Answer · 2013-06-30 02:49:33Z

2

The easiest way to do this without rewriting your code would be to change the value of the drop down and then trigger the change event so that the your existing event handler gets called when the DOM is ready. Something like:

$(document).ready(function() {
    $('#filter-value').val(5).change();
});

answered Jun 30, 2013 at 2:49

j08691

208k33 gold badges269 silver badges281 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

TNK Over a year ago

I tried it. But its now working for me. Not working mean It is not displaying table on the page when page is loaded.

TNK Over a year ago

I changed my code something like this - $('#filter-value').val(5).change(function(){ ....... }

j08691 Over a year ago

Keep your existing function and add the code I gave you after it. See: jsfiddle.net/j08691/w3AYP

Collectives™ on Stack Overflow

Getting a default value from dropdown and display a table

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related