MVC & jQuery & Ajax: JavaScript жүктелуін күтіңіз

Мен ASP.NET MVC және jQuery-ді қолданамын және Ajax арқылы PartialView жүктеймін. Жеке JavaSriptFile осы PartialView элементіне жатады. Сәттілікке орай, html қайтару DOM-ке енгізіледі. JavaScript-де кейбір заттар жасалады және бір-біріне біраз уақыт кетуі мүмкін. Жүктелген мазмұн диалог терезесінде көрсетіледі.

Жеңілдетілген код:

1  $.ajax({
2    url: /user/edit,
3    dataType: 'html',
4    data: { id: 1 },
5    success: function (htmlCode) {
6       $('#dialogEditUser').html(htmlCode);
7       $('#dialogEditUser').dialog('open');
8    });
9 };

Бұл код жұмыс істейді және кейде PartialView JavaScript-тің қаншалықты тез орындалатынына байланысты жұмыс істейді. Сондықтан кейде диалог ашылмайды. Сондықтан мен 7 нөмірлі жолды өзгертті:

7      setTimeout(function() { $j('#dialogEditUser').dialog('open') }, 250);

Енді барлығы жақсы жұмыс істейді. Бірақ бұл «бұзу» өте қолайлы емес. PartialView-дің JavaScript-нің жүктелген мазмұнда орындалуын қалай тексеруге болады? Толық көрсетілетін ішінара бейнені қайтарудың кез келген тәсілі бар ма (демек, JavaScript AjaxCall қайтып оралғанда орындалады?

2

4 жауаптар

Неге жүктеп жатқан JS ішіне $ ('# dialogEditUser') тілқатысу терезесі ('ашық'); ? Осылайша қоңырау жасалса, Сізге тиісті JS жүктелгенін білесіз

2
қосылды
@Simon Жаһандық айнымалы мәнді орнатыңыз немесе URL ішіндегі параметрді беріңіз.
қосылды автор robertc, көзі
бұл менің жауапымды толығымен мағыналы етеді. мен оны неге қиындатып отырғанымды білмеймін. +1
қосылды автор nathan gonzalez, көзі
Жақсы идея, бірақ бұл мүмкін емес, себебі жүктелген ішінара көрініс әрдайым диалог ретінде пайдаланылмайды. Менің сұрағым, жалпы алғанда, «javaScript жүктелсін деп күтемін», себебі менде JavaScript жүктелетін ajax қоңырауынан кейін күте тұратын шешімдерімдегі басқа жағдайлар бар.
қосылды автор iappwebdev, көзі
Сондықтан, ішінара көріністің кірістірілуінен кейінгі кодтың онымен ешқандай байланысы жоқ, бірақ кірістіруден кейін орындалуы керек екенін елестетіңіз. Бұған қалай қол жеткізуге болады? Мен Galled ұсынғандай, DOM-ді өзгертуді қаламаймын. 3. Алдыңғы JavaScript-ні жүктеп алу және орындау үшін қолайлы әдіс болуы керек. Мүмкін, кері шақыру функциясы Немесе жаһандық сценарийді тіркеуші?
қосылды автор iappwebdev, көзі

Әдепкі бойынша, ajax аяқтауды сұрауды күтпейді Сәйкесінше параметрін жалған етіп орнатуға тырысыңыз:

$.ajax({
    url: /user/edit,
    dataType: 'html',
    async: false,
    data: { id: 1 },
    success: function (htmlCode) {
       $('#dialogEditUser').html(htmlCode);
       $('#dialogEditUser').dialog('open');
    });
};

More details in docs

1
қосылды
Мен іздеймін. Шын мәнінде, мен бұл біреуді сынап көрдім. Бірақ js-файл ішінара көріністе jQuery.getscript() арқылы жүктелді, ол әдепкі бойынша шынайы болып табылады. Сондықтан мен jQuery.ajax() деген шақыруды өзгерттім және опцияны async параметрін жалған деп өзгерттім, бірақ бастапқы ajax-қоңырауды өзгертудің қажеті жоқ. Сондықтан соңында async = true параметрімен ajax-call-ға оралған option async = жалғаны бар ajax-қоңырау бар. Сұрақ: мұндай мәселелерді қалай шешуге болады?
қосылды автор iappwebdev, көзі

Егер сіздің жеке көрінісіңіздің соңында сіз #finishLoad сияқты белгілі бір идентификаторы бар элементке ие болсаңыз. Неге бұлай етпейсіз?

var waitToOpenDialog = function(){
    var jFinish = $('#finishLoad');

    if(jFinish.length<=0){
        setTimeout(waitToOpenDialog, 10);
    }else{
        $('#dialogEditUser').dialog('open');
    }
}

$.ajax({
    url: /user/edit,
    dataType: 'html',
    data: { id: 1 },
    success: function (htmlCode) {
        $('#dialogEditUser').html(htmlCode);
        waitToOpenDialog();
    });
};

Егер сіз өзіңіздің DOM-іңізді өзгерте алмасаңыз немесе #finishLoad сияқты идентификаторға ие болмасаңыз, сіз (көп немесе аз) бұл әрекетті (async = true сақтау)

var waitToOpenDialog = function(){
    var jDialogUser= $('#dialogEditUser');

    if(jDialogUser.html().length<=0){
        setTimeout(waitToOpenDialog, 10);
    }else{
        jDialogUser.dialog('open');
    }
}

$.ajax({
    url: /user/edit,
    dataType: 'html',
    data: { id: 1 },
    success: function (htmlCode) {
        $('#dialogEditUser').html(htmlCode);
        waitToOpenDialog();
    });
};

Немесе толық аяқтауға болады:

$.ajax({

        url: /user/edit,
        dataType: 'html',
        data: { id: 1 },
        success: function (htmlCode) {
            $('#dialogEditUser').html(htmlCode);
        },
        complete: function(){
            $('#dialogEditUser').dialog('open');
        }
)};
0
қосылды
Қосымша опцияларды қосыңыз.
қосылды автор Galled, көзі
Бұл шешім, бірақ менің ойымша, бұл мәселені шешудің жақсы жолы емес. DOM шығындар уақытын өзгерту және DOM-ды өзгертпестен бұл мәселені шешуге тырыстым.
қосылды автор iappwebdev, көзі

Бұл кодты дайын блокта орап көріңіз:

$(document).ready(function(){
   $.ajax({
     url: /user/edit,
     dataType: 'html',
     data: { id: 1 },
     success: function (htmlCode) {
        $('#dialogEditUser').html(htmlCode);
        $('#dialogEditUser').dialog('open');
     });
   };
});

'#dialogEditUser' сәтті шақыру кері шақырылған кезде әлі жүктелуі мүмкін.

0
қосылды
Кешіріңіз, мен js-File-ті орналастырған болар едім. Әрине, барлығы $ (құжат) .ready-Call кейін орындалады.
қосылды автор iappwebdev, көзі