jQueryUI对话框重新打开输入文本未禁用

时间:2012-04-09 13:50:50

标签: jquery jquery-ui dialog

我在飞行中创建一个对话框,当我第一次打开它时它会打开它,但当我再次尝试重新打开它时,我创建的函数单击不起作用。这是我的代码,它都在onready函数中。我只是试图禁用输入字段并给它焦点。非常感谢。

$("#rdoAddressN").click(function(){
    var html;
    html="<table>"
                +"<tr>"
                    +"<td style='font-size: 14px;'  align='center'><strong>D I R E C T O R I O</strong></td>"
                +"</tr>"
                +"<tr>"
                    +"<td align='center' nowrap>"
                    +"<input name='zipcodeType' id='zipcodeTypeCP' value='1' type='radio' style='margin: 10px'><strong>CP</strong>"
                    +"<input name='zipcodeType' id='zipcodeTypeCol' value='2' type='radio'  style='margin: 10px'><strong>Colonia</strong>"
                    +"<input name='btnBuscarCP' id='btnBuscarCP' value='Buscar' type='button'  style='margin: 10px'>"
                    +"</td>"
                +"</tr>"
                +"<tr>"
                    +"<td align='center'>"
                        +"<input autocomplete='off' name='zipcodeDialog' id='zipcodeDialog' class='zipcodeDialog' size='50' class='authInput' type='text' disabled='disabled' />"
                    +"</td>"
                +"</tr>"
                +"<tr>"
                        +"<td >"
                            +"<div style='width: 576px; opacity: 0.999999; display: none;' id='divResultsCP' align='center'>"
                            +"</div>"
                        +"</td>"
                    +"</tr>";

        +"</table>";

    var caja2 = $('<div title="Direccion de Codigos Postales"><p>'+html+'</p></div>');
    caja2.dialog({modal: true,show: 'fade',hide: 'fade',height:'auto',width:'auto'});
    $(":button").button();
    $('#zipcodeTypeCP').click(function(){
        $('.zipcodeDialog').remove("disabled");
        $('.zipcodeDialog').attr("disabled", true);
        $('.zipcodeDialog').attr("disabled", false);
        $('.zipcodeDialog').focus();
    })
    $('#zipcodeTypeCol').click(function(){
        $('.zipcodeDialog').remove("disabled");
        $('.zipcodeDialog').attr("disabled", true);
        $('.zipcodeDialog').attr("disabled", false);
        $('.zipcodeDialog').focus();
    })
    $('#btnBuscarCP').click(function(){
            if($('#zipcodeDialog').val().length>3){
            $("#divResultsCP").html('<img src="img/ajax-loader-big.gif" />')
            $.ajax({
                data: "texto="+ $('#zipcodeDialog').val()+"&zipcodeType="+$('input:radio[name=zipcodeType]:checked').val() ,
                type: "post",
                dataType: "json",
                url: "ajax/cp.php",

                success: function(data){
                        switch(data.error){
                        case undefined:
                                if(data.mensaje==undefined){
                                    $("#autocomplete_choices").html('');
                                    var tabla="<table  class='cptable'>";
                                    tabla+="<tr >"
                                        tabla+="<td ></td>";
                                        tabla+="<td>CP</td>";
                                        tabla+="<td>Colonia</td>";
                                        tabla+="<td>Municipio</td>";
                                        tabla+="<td>Ciudad</td>";
                                        tabla+="<td>Estado</td>";
                                    tabla+="</tr>"

                                    for(index=0; index<data.length; index++) {
                                        tabla+='<tr><td><a href=""> + </a></td><td>' + data[index].postal_code +  '</td><td> ' + data[index].colony_name + '</td><td>'+ data[index].d_mnpio+'</td><td>'+ data[index].city_name+'</td><td> '+data[index].state_name+'</td></tr>'
                                    }
                                    tabla+="<table>"
                                }else{
                                    tabla=data.mensaje;
                                    $("#divResultsCP").addClass("ui-state-highlight");
                                }
                                $("#divResultsCP").html(tabla)
                                $("#divResultsCP").show()
                            break;
                        case 'Login':
                                $("#autocomplete_choices").html('');
                                alert("Usuario No logueado");
                            break;
                        default:
                                $("#autocomplete_choices").html('');
                                $("#divResultsCP").html(data.error);
                                $("#divResultsCP").addClass("ui-state-highlight");
                            break;
                    }
                }
                ,error: function (request, status, error) {
                    alert(request.responseText);
                }


            });
        }
    });

})`

1 个答案:

答案 0 :(得分:0)

好吧,午休时间,我看到没有人给你一个体面的答案。我让你成为jsFiddle,它可能会告诉你如何更轻松地完成你想做的事情。如果没有,它应该向您展示如何更好地使用jQuery和HTML。像你正在做的那样创建长字符串的HTML完全违背了jQuery“做得更多,写得更少”的目的。他们已经完成了艰苦的工作,你需要做的就是聪明地工作。

See Working jsFiddle Here

( - ajax url工作,因为我没有真正的php控制器来调用,但我估计成功代码,如果你将它应用到你的本地开发者,它应该仍然可以正常工作)

另外,如果我知道更多的期待和发生的事情,实际上,即使是我的工作实例也可能会减少大约十几行左右。那个和我试图使用“最简单”来理解jQuery的一部分,但是有很多不同的方法来完成诸如“附加”html和其他一些元素之类的事情。