开发者

jQuery + Jeditable - detect when select is changed

I'm using Jeditable for in-place editing. One the controls I am working with has the select type. When a user clicks on the field, the following select control is generated:

<div id="status" class="editable_select">
    <form>
        <select name="value">
            <option value="Active">Active</option>
            <option value="Inactive">Inactive</option>
        </select>
        <button type="submit">Save</button>
        <button type="cancel">Cancel</button>
    </form>
</div>

What I am trying to figure out is how to use jQuery to detect when that select control is changed, especially since it doesn't have an ID attribute.

开发者_StackOverflow中文版

This is what I have so far, but the event is not getting triggered:

$(document).ready(function () {
    $('#status select').change(function () {
        alert("Change Event Triggered On:" + $(this).attr("value"));
    });
});

UPDATE

Updating to jQuery 1.4.2 solved my problem along with using Matt's solution.


You'll probably find its because the select field is been added to the page after it's loaded (and after your event bindings take place).

You can still capture change events if this is the case by using live

$(document).ready(function () {
    $('#status select').live('change', function () {
        alert("Change Event Triggered On:" + $(this).attr("value"));
    });
});

Note that since 1.7 however, the on() method is the preferred way to bind event handlers. The equivalent of the above is;

$(document).ready(function () {
    $(document).on('change', '#status select', function () {
        alert("Change Event Triggered On:" + $(this).attr("value"));
    });
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜