Question

我为我的UI类创建了一个清除包含div的输入的方法。

问题是，一旦调用它，在刷新页面之前，复选框永远不会通过AJAX调用设置。以下示例适用于我的组/用户管理。如果单击要编辑的组，将弹出一个jQuery UI对话框，其中包含该组的属性和权限。如果取消并尝试添加新输入，则清除输入。如果您之后转到编辑组，则不会更新输入。

编辑：如果单击取消按钮，无论是否调用了我的clearInputs方法，复选框似乎都会停止工作。

以下是UI类的方法：

clearInputs: function(container) {

    $(container + " :input").val("");
    $(container).find('input[type=checkbox]:checked').prop('checked', false);
}

一个调用代码的例子（从我的项目中复制，但我减少了一些胖...

/* The user clicks the edit group button... */
$(document).delegate('.group_edit', 'click', function() {
    var groupId = $(this).attr('id').replace("group_edit_", "");

    // This call to the clearInputs method is commented out,
    // and behaves as I described above.    
// ui.clearInputs("#dialogGroup");

$.ajax({
    type: "POST",
        url: "ajax.users.php",
    data: {
        action: "get_privs",
        group: groupId
    },
    success: function (result) {
        if (result.success == true) {
        // Set the name value
        $("#name").val(result.GroupName);

        // Update each of the checkboxes
        $.each(result.privs, function(priv, grant) {
            grant = Boolean(parseInt(grant));
        $('#dialogGroup input[value=' + priv + ']').prop('checked', grant);
        });

        /* Create the dialog */
        $("#dialogGroup").dialog({
        buttons: {
        "OK" : function () {
            $(this).dialog("close");

            var form_data = new Array();

                        $.each($("input[@name='cbox[]']:checked"), function() {
                form_data.push($(this).val());
            });

            $.ajax({
                            /* Saves the form data */

            });
        },
        "Cancel": function() {
            ui.clearInputs("#dialogGroup");
        $(this).dialog("close");
        }
}
});

最后添加一个组：

$(document).delegate('#group_add', 'click', function() {
var dialog = "#dialogGroup";

// ui.clearInputs(dialog);

$(dialog).dialog({
    modal: true,
    title: "Create Group",
    buttons: {
        "OK": function() {
        $(this).dialog("close");
        $("#dialogNotify").html("Saving...");
        $("#dialogNotify").dialog('open');
        var form_data = new Array();

                $.each($("input[@name='cbox[]']:checked"), function() {
            form_data.push($(this).val());
        });


        $.ajax({
                    /* Save the form data */
        });

},
Cancel: function() {
    $(this).dialog("close");
}
}
});


});

我希望我包括所有内容......如果不是，我会更新。

Answer 1

我明白了。问题出在我的方法中，我有：

clearInputs: function(container) {

    $(container + " :input").val("");
    $(container).find('input[type=checkbox]:checked').prop('checked', false);
}

该方法的第一行，我想是对所有输入做了一些事情。

如果您将第一行更改为

$(container + " :input[type=text]").val("");

工作正常......

Answer 2

试试这个：

$( document ).ready(function()
{
    var search_on = $('#formX');

    $( search_on )

    //CHANGE "input" for "input,select" to search all fields
    .find('input')

    .each(function( e )
    {
        if( $(this).attr('type') == 'radio' || $(this).attr('type') == 'checkbox' )
        {
            $(this).attr('checked',false);
            //USE RESET() IF IS A FORM FIELD
            $(this).reset();
        }

        //IF IS A DROPDOWN
        /*
        else if( $(this).attr('type') == undefined )
        {
            $(this).find('option').attr('selected',false);
        }
        */

        else
        {
            $(this).val('');
            //USE RESET() IF IS A FORM FIELD
            //$(this).reset();
        }

    });
});

或使用此功能（如果是表格）：

jQuery.fn.reset = function () {
  $(this).each (function() { this.reset(); });
}

并致电

$('#formX').reset();

用于清除输入的JS JQuery方法效果很好

2 个答案: