2012-08-14 16 views
7

में बाहरी php फ़ाइल लोड करें जब मैं किसी लिंक पर क्लिक करता हूं तो मैं एक jquery modal संवाद बॉक्स खोलने का प्रयास कर रहा हूं। मैं फिर संवाद बॉक्स में बाहरी PHP फ़ाइल लोड करना चाहता हूं।jquery modal dialog onclick

$(document).ready(function() { 
    $('#register').dialog({ 
     title: 'Register for LifeStor', 
     resizable: true, 
     autoOpen:false, 
     modal: true, 
     hide: 'fade', 
     width:350, 
     height:275, 
     });//end dialog 
     $('#reg_link').click (function() { 
      open: (function(e) { 
      $('#register').load ('register.php'); 
     }); 
     }); 
    }); 

और इस एचटीएमएल:: मैं इस jQuery का उपयोग कर रहा

<div id="register"></div> 

जो प्रदर्शित करने के लिए सेट है: .css फ़ाइल में कोई नहीं।

इसके अलावा पर एक फार्म के अंदर, लिंक कहा जाता है:

<td><font size="2">Not registered? <a href="#" name="reg_link">Sign-Up!</a></td> 

(मैं divs करने के लिए टेबल बदल रहा हो जाएंगे)।

मुझे इस कोड के साथ कोई त्रुटि नहीं है, लेकिन जब मैं लिंक पर क्लिक करता हूं तो कुछ भी नहीं होता है। मुझे उपरोक्त में से अधिकांश को अन्य स्टैक ओवरफ़्लो पोस्ट से मिला है। क्या मैं कुछ भूल रहा हूँ? क्या टेबल एचटीएमएल हस्तक्षेप कर रहा है?

सादर ...

उत्तर

16

अपने लिंक में

<a href="#" name="reg_link">Sign-Up!</a> 

आप name="reg_link" है id="reg_link" बजाय होना चाहिए, यानी

<a href="#" id="reg_link">Sign-Up!</a> 

तो यह कोड निम्नलिखित

$('#reg_link').click(function(e) { 
    e.preventDefault(); 
    $('#register').load('register.php'); 
}); 

यह एक संवाद बनाने के साथ काम करेंगे आप उपयोग कर सकते

$(document).ready(function() { 

    var dlg=$('#register').dialog({ 
     title: 'Register for LifeStor', 
     resizable: true, 
     autoOpen:false, 
     modal: true, 
     hide: 'fade', 
     width:350, 
     height:275 
    }); 


    $('#reg_link').click(function(e) { 
     e.preventDefault(); 
     dlg.load('register.php', function(){ 
      dlg.dialog('open'); 
     }); 
     }); 
}); 

Just an example

+1

ऐसा किया गया है - आप सभी टुकड़ों को एक साथ रखते हैं, बहुत बहुत धन्यवाद। – cdonahue

+0

आपका स्वागत है :-) –

+0

@ शेखहेरा: कहें 'register.php' के पास दूसरे पृष्ठ का एक लिंक है, इसे पुष्टिकरण कहते हैं। Php - आप उसी मोडल व्यू के भीतर' confirmation.php' कैसे खोलेंगे? धन्यवाद! – greenpool

2

बनाएं संवाद आप लोड के बाद पेज .load() नई सामग्री

आपका क्लिक हैंडलर वाक्यविन्यास त्रुटियों के साथ कंटेनर की सामग्री को बदल देता है, ऐसा लगता है कि अपने का एक संयोजन गुजर तरह एक समारोह और एक वस्तु तर्क के रूप में, यह एक सामान्य कार्य होना चाहिए। मैं .dialog() समारोह के साथ पूरी तरह से परिचित नहीं हूँ जैसा

$('selector').click (function() { 
    //code 
}); 

इसके अलावा अपने <a> तत्व reg_link एक नाम नहीं आईडी

$(document).ready(function() { 
    $('#reg_link').click (function() { 
     $('#register').load ('register.php', function(){ 
      $('#register').dialog({ 
       title: 'Register for LifeStor', 
       resizable: true, 
       modal: true, 
       hide: 'fade', 
       width:350, 
       height:275, 
      });//end dialog 
     }); 
    }); 
}); 

<td><font size="2">Not registered? <a href="#" name="reg_link" id="reg_link">Sign-Up!</a></td> 
1

के रूप में है, लेकिन आप .click() गलत प्रयोग कर रहे हैं। इस मुद्दे का हिस्सा घुंघराले ब्रेसिज़ {} के बारे में कुछ भ्रम है। उनका उपयोग दो पूरी तरह से अलग चीजों के लिए किया जाता है, और आप यहां दो मिश्रण कर रहे हैं।

घुंघराले ब्रेसिज़ का पहला उपयोग एक ब्लॉक के इंटीरियर को इंगित करना है: एक लूप के अंदर, एक स्थिति के अंदर, एक समारोह के अंदर। उदाहरण के लिए:

// some code in the global scope 
function something() 
{ 
    // some different code within this function block 
} 
// function's done, we're back in global scope 

दूसरा उपयोग JSON है (जावास्क्रिप्ट ऑब्जेक्ट नोटेशन) एक वस्तु या साहचर्य सरणी, जहां गुण या मान के नाम या निम्न स्वरूप में कुंजी के साथ जोड़ा जाता है के लिए:

var jsonSomething = { 
    key1: value1, 
    key2: value2, 
    etc: etcvalue, 
}; 

जब आप $('#reg_link').click (function() { लिखते हैं, आप उस घुंघराले ब्रेस के साथ फ़ंक्शन ब्लॉक खोल रहे हैं, JSON प्रारंभ नहीं कर रहे हैं। इस प्रकार, जब आप open: लिखते हैं (जैसे कि यह एक JSON था और आप open कुंजी सेट कर रहे हैं), तो निश्चित रूप से कुछ ऐसा करने के लिए काम नहीं करेगा जिस पर आप उम्मीद करते हैं (मैं आश्चर्यचकित हूं ... वास्तव में कोई त्रुटि नहीं है)। उन घुंघराले ब्रेसिज़ के भीतर आपको क्या लिखना है, एक फ़ंक्शन का कोड है। इस मामले में, यह शायद है सिर्फ इस:

$('#reg_link').click (function() { 
    $('#register').load ('register.php'); 
}); 

सामान्य तौर पर, jQuery इन संस्करणों एक बहुत के दोनों का उपयोग करता है, और अक्सर उन्हें एक साथ मिक्स (कार्यों कि तर्क या JSONs रूप JSONs स्वीकार करते हैं कि समारोह कॉलबैक के रूप में शामिल हैं प्रविष्टियां), इसलिए यह समझना वाकई महत्वपूर्ण है कि कौन सा है।

संपादित करें: कुछ Googling पुन: .dialog() पता चलता है कि आप भी .load() के बाद इसे कहते हैं, जिसका अर्थ है कि ब्लॉक कुछ इस तरह देखना चाहिए की आवश्यकता होगी:

$('#reg_link').click (function() { 
    $('#register').load ('register.php').dialog(/*argument(s) here*/); 
}); 

अपने खुद के कोड के आधार पर, .dialog() वास्तव में है एक समारोह है कि एक तर्क के रूप एक JSON लेता है, तो यह है कि बिट के सही, पूर्ण कोड संभालने का एक उदाहरण इस तरह है:

$('#reg_link').click (function() { 
    $('#register').load ('register.php').dialog({ 
     title: 'Register for LifeStor', 
     resizable: true, 
     autoOpen: false, 
     modal: true, 
     hide: 'fade', 
     width:350, 
     height:275, 
    }); 
}); 
+0

उस स्पष्टीकरण के लिए धन्यवाद - घुंघराले ब्रेसिज़ के आसपास भ्रम को साफ़ करता है। .dialog JSON तर्क लेता है, इसलिए मुझे लगता है कि आप और # मुसा सही हैं। लोड समस्या है। दुर्भाग्यवश उपरोक्त मेरे लिए अभी तक काम नहीं करता है, इसलिए मैं शोध रखता हूं। – cdonahue

संबंधित मुद्दे