एक्स - अन्य तत्व

Question

पर क्लिक करने पर संपादन योग्य इनपुट संपादन योग्य मेरे पास एक एक्स-संपादन योग्य इनपुट है, जिसे मैं उपयोगकर्ता नाम संपादित करने के लिए उपयोग कर रहा हूं। तत्व की डिफ़ॉल्ट क्रिया तब होती है जब आप स्वयं पर क्लिक करते हैं, आप एक मान संपादित कर सकते हैं। लेकिन मैं तत्व के संपादन योग्य पर क्लिक करना सक्षम करना चाहता हूं और अपने इनपुट के अंदर मूल्य को संपादित करने में सक्षम होना चाहता हूं। यहां मेरी सामग्री की स्थिति को कम करने के लिए a jsfiddle है।

jQuery:

$(function(){ 
    $.fn.editable.defaults.mode = 'inline'; 
    $('#publicname-change').editable({ 
    type: 'text', 
    url: '/post', 
    pk: 1, 
    placement: 'top', 
    title: 'Enter public name' 
    } 
); 

//ajax emulation. Type "err" to see error message 
$.mockjax({ 
    url: '/post', 
    responseTime: 100, 
    response: function(settings) { 
    if(settings.data.value == 'err') { 
     this.status = 500; 
     this.responseText = 'Validation error!'; 
    } else { 
     this.responseText = ''; 
    } 
    } 
}); 

HTML:

<div class="control-group control-group-inline"> 
    <label class="control-label labelModified" for="publicname-change">Public name:</label> 
    <div class="controls"> 
    <a href="#" id="publicname-change" class="editable editable-click inline-input">Mr. Doe</a> 
    <div class="edit">edit <i class="icon-pencil pencil-input-change"></i></div> 
    </div> 
</div> 

यह अगर किसी ने मुझे और संपादित तरह से मैं वर्णित में अपने सभी जुड़े हुए jsfiddle मदद कर सकते हैं अच्छा होगा। क्लिक करें .edit पर, मूल्य संपादित करने में सक्षम हो।

Answer 1

यह एक समारोह में कहा जाता है कि आप उपयोग कर सकते हैं सक्षम संपादित सक्षम करने के लिए

$('.edit').click(function(e){  
     e.stopPropagation(); 
     $('#publicname-change').editable('toggle'); 
}); 

यह काम नहीं करेगा अगर आप पहली पंक्ति में शामिल न करें क्योंकि डिफ़ॉल्ट व्यवहार किसी अन्य के क्लिक पर संपादित निष्क्रिय करने के लिए है तत्व।

संपादित करें:

केवल संपादित करें बटन पर क्लिक करें न कि पाठ पर संपादन को सक्षम करने के manual करने के लिए toggle गुण सेट।

$('#publicname-change').editable({ 
    type: 'text', 
    url: '/post', 
    pk: 1, 
    placement: 'top', 
    title: 'Enter public name', 
    toggle:'manual' 
} 

JSFiddle