Stop select.change from sending back

Question

this problem is part of a larger page, but I simplified the code to provide a simple example of what I'm saying. Basically, I have an ASP dropdown with AutoPostBack = "true", and I want to do some client side javascript, which can stop the postback if necessary. However, I cannot get him to stop the postback.

<script type="text/javascript">
$(document).ready(function()
{
    $("#ddl").bind('change', function() {
        return false;
    });
});
</script>

<select id="ddl" onchange="form.submit()">
    <option value="">Item 1</option>
    <option value="">Item 2</option>
    <option value="">Item 3</option>
    <option value="">Item 4</option>
    <option value="">Item 5</option>
</select>

Answer 1

This is my workaround (Firefox works, IE 7/8 works):

$(function() {
    var $select = $('#ddl'), tmp = $select.attr('onchange');

    $select.attr('onchange', '');

    $select.change(function() {
        // If you want to postback:
        tmp();
    });
});

HTML . , , .

Answer 2

:

$(document).ready(function() {
  $('#ddl').attr('onchange', '').change(function() {
    if (0 !== +$(this).attr('selectedIndex')) {
      this.form.submit();
    }
    return false;
  });
});

Answer 3

$("#ddl").change(function(e) {
    e.preventDefault();
});

Answer 4

$("#ddl").change(function() {
    // Do some javascript
    return false;
});

Also, this can help if you take the onChange attribute from the select element.