jQuery 대화 상자 다시 정의하기

우리는 일반적인 함수를 사용하여 모듈 특정 내용을 포함하는 jQuery 대화 상자를 작성합니다. 사용자 정의 대화 상자는 3 개의 버튼 (취소, 저장, 적용)으로 구성됩니다. 적용은 저장과 동일하지만 대화 상자를 닫습니다.jQuery 대화 상자 다시 정의하기

많은 모듈에서 여전히 ajax-post 대신 사용자 정의 게시물을 사용하고 있습니다. 이러한 이유로 특정 대화 상자에있는 단추를 덮어 쓰거나 다시 정의하려고합니다.

지금까지 버튼이 있지만 그걸로 뭔가 할 수 없습니다. 대화 상자에서 단추를 가져 오는 것이 가능합니까 (예, 알고 있습니다). 그러나 다른 기능을 적용 할 수 있습니까? 지금까지

내 코드 :

function OverrideDialogButtonCallbacks(sDialogInstance) { 
    oButtons = $('#dialog').dialog('option', 'buttons'); 
    console.log(oButtons); // logs the buttons correctly 

    if(sDialogInstance == 'TestInstance') { 
    oButtons.Save = function() { 
     alert('A new callback has been assigned.'); 
     // code for ajax-post will come here. 
    } 
    } 
}

출처

2012-10-09 Ben

$ ('# 대화') 대화 상자 ({ '버튼': { '저장': { 클릭 기능 () { // }, }, } }); // 이것을 시도 했습니까? –

이것은 실제로 작동합니다. 하지만 이제는 모든 버튼을 다시 정의해야합니다 (문제는 아닙니다). 그럼에도 불구하고 버튼을 '가져 와서'새로운 콜백 함수를 적용 할 수 있는지 궁금합니다. – Ben

버튼 id를 확인하고 click 이벤트에 콜백을 위임합니다. –

$('#dialog').dialog({ 
'buttons' : { 
    'Save' : { 
     id:"btn-save", // provide the id, if you want to apply a callback based on id selector 
     click: function() { 
      // 
     }, 
    }, 
} 
});

당신이 시도 했습니까? 필요에 따라 버튼의 콜백을 재정의합니다.

출처

2012-10-09 10:06:48

전체 단추를 대화 상자에 다시 할당하는 방법이 있습니다. 감사. – Ben

? 'oButtons는 배열이 아닙니다! – naveen

Naveen이 정확합니다. +1. 그의 대답에서 그는 재 할당 할 필요가 없다고 말한다. 그가 말한 접근 방식을 따라갈 수 있습니다. –

저장 하시겠습니까? 클릭 이벤트로 새 기능 코드를 바인딩 할 수 있습니까?

출처

2012-10-09 10:15:49

어떤 이유로 ID를 찾을 수 없습니다 (버튼에 적용되는 동안이 기능이 작동하지 않습니다). 귀하의 의견을 보내 주셔서 감사합니다. – Ben

참조하기 전에 구성 요소가로드되었는지 확인하십시오. –

$(..).dialog('option', 'buttons')을 사용하여 단추를 가져올 수 있습니다.

// Rewire the callback for the first button 
var buttons = $('#dialog').dialog('option', 'buttons'); 
buttons[0].click = function() { alert('Click rewired!'); };

는 예를 들어,이 바이올린을 참조하십시오 : 이것은 당신이 다음 그들을 통해 검색 및 클릭 이벤트 조정하여 해킹 수있는 개체의 배열을 반환 http://jsfiddle.net/z4TTH/2/

필요한 경우를, 당신의 텍스트를 확인할 수 있습니다 버튼을 button[i].text을 사용하십시오.

UPDATE :

buttons 옵션은 두 가지 형태 중 하나 일 수 있고, 하나는 상술 한 바와 같이 배열하고, 나머지는 각 등록 버튼의 이름 인 객체이다. 이 경우에 클릭 이벤트를 해킹하기 위해이 대화 상자에서 buttons 옵션을 업데이트 할 필요가있다 : http://jsfiddle.net/z4TTH/3/

출처

2012-10-09 10:30:08 FixMaker

첫 번째 옵션이 제 설정에서 작동하지 않습니다. 두 번째 옵션은 다른 저장 버튼을 추가합니다.) 입력 해 주셔서 감사합니다! – Ben

+1 : 업데이트가 제대로 작동합니다. – naveen

재 할당을 위해 전혀 필요 없음 :

// Rewire the callback for the OK button 
var buttons = $('#dialog').dialog('option', 'buttons'); 
buttons.Ok = function() { alert('Click rewired!'); }; 

$('#dialog').dialog('option', 'buttons', buttons);

이 바이올린을 참조하십시오. 이 시도. OverrideDialogButtonCallbacks("#dialog");

같은

function OverrideDialogButtonCallbacks(dialogSelector) { 
    var button = $(dialogSelector + " ~ .ui-dialog-buttonpane") 
        .find("button:contains('Save')"); 

    button.unbind("click").on("click", function() { 
     alert("save overriden!"); 
    }); 
}

전화를 작동 바이올린 :. http://jsfiddle.net/codovations/yzfVT/

출처

2012-10-09 11:42:06 naveen

jQuery 대화 상자 다시 정의하기

답변

관련 문제