0

I'm trying to make a piece of dojo Code work and having a bit of a hard time. The intention behind it goes like this:

1- Have a select fire an onChange event that retrieves a list of options through dojo.xhrGet. 2- Have each one of the options retrieved get its own onclick event associated/binded to it and the function that it fires takes 2 arguments

Problem: At this point the onClick event on the options fires as soon as it is retrieved through Ajax and doesn't pass the firt argument. The events stop firing after that (a click produces nothing).

Thank you for your feedback in advance. The Code follows

JS

function checkAvailable(i){
    var id_prog = 'programa_'+i;
    var id_coreo = 'coreografia_'+i;

    var prog = dojo.byId(id_prog).value;

    dojo.xhrGet({
        url:"ajaxCoreo.php",
        handleAs:"text",
        content: {
            programa: prog,
            item: i
        }, 
        load: function(data){
            var targetNode = dojo.byId(id_coreo);
            dojo.place(data,targetNode,"only");
            dojo.byId(id_coreo).disabled = false;
            var callback = function(evt){
                var j = evt.target.innerHTML;

                checkPack(j,i);
                console.log('write me if you fire inside first function');
            };
            dojo.query("#coreografia_1>option").connect('click', callback);
            setValor(i);
        }

    });

}



    function checkPack(j,i){
    console.log('write me if you fire inside second function');
    console.log(j);
    console.log(i);

    var num = j;
    var id_prog = 'programa_'+i;
    var id_coreo = 'coreografia_'+j;

    var prog = dojo.byId(id_prog).value;

    dojo.xhrGet({
        url:"ajaxPack.php",
        handleAs:"text",
        content: {
            programa: prog,
            coreo: j
        },
        load: function(data){

            if(data=="true"){
                dojo.query("option[value="+num+"]").forEach(dojo.destroy);
                alert('O Pack escolhido já foi encomendado previamente.');
                setValor(i);
            }

        }

    });

}

HTML

<select name="programa[]" id="programa_1" onChange="checkAvailable(1)" title="obrigatorio">
                <option value="0">Choose your program</option> 

</select>
 <select name="coreografia_1" id="coreografia_1" disabled="disabled" title="obrigatorio">
                <option value="0" selected="selected">Escolha Um Programa</option> //this is the node that is populated by the first xhrGet call
            </select>

EDIT: I've edited the code to reflect the changes to it and added the html

4

2 回答 2

0

根据我的经验，如果您花费超过 1 天的时间尝试跟踪跨浏览器问题，那么它可能与您的基本 html 知识或基本 Js 概念有关。

这与只有 FF 管理直接附加到选项标签的 onclick 事件这一事实有关。对于其他人，您需要将 onchange 附加到父级。

所以这是工作代码的最终版本，以防有人遇到类似问题

function checkAvailable(i){
    var id_prog = 'programa_'+i;
    var id_coreo = 'coreografia_'+i;

    var prog = dojo.byId(id_prog).value;

    dojo.xhrGet({
        url:"ajaxCoreo.php",
        handleAs:"text",
        content: {
            programa: prog,
            item: i
        }, 
        load: function(data){
            var targetNode = dojo.byId(id_coreo);
            dojo.place(data,targetNode,"only");
            dojo.byId(id_coreo).disabled = false;
            var callback = function(evt){
                var j = evt.target.value;
                checkPack(j,i);
            };
            dojo.query("#coreografia_"+i).connect('onchange', callback);
            setValor(i);
        }

    });

}



    function checkPack(j,i){
    console.log('write me if you fire inside second function');
    console.log(j);
    console.log(i);

    var num = j;
    var id_prog = 'programa_'+i;
    var id_coreo = 'coreografia_'+j;

    var prog = dojo.byId(id_prog).value;

    //Confirma Se não há encomendas previas deste pack (um máximo de 2 anteriores)

    dojo.xhrGet({
        url:"ajaxPack.php",
        handleAs:"text",
        content: {
            programa: prog,
            coreo: j
        },
        load: function(data){

            if(data=="true"){
                dojo.query("#coreografia_"+i+" option[value="+num+"]").forEach(dojo.destroy);
                alert('O Pack escolhido já foi encomendado previamente.');

            }

        }

    });
}
于 2012-04-20T14:41:57.900 回答
0

通过检查您的代码，我可以看到在函数checkAvailable中，在您连接到onclick事件的行中，而不是将函数作为回调传递，您正在调用它。

dojo.connect(opt,'onclick', checkPack(opt.target.innerHTML,i));

你应该这样做：

var callback = function(){
    checkPack(opt.target.innerHTML,i);
};
dojo.connect(opt,'onclick', callback);
于 2012-04-18T21:09:43.230 回答