2013-07-08 16 views
5

मैं एक फ़ंक्शन लिखने की कोशिश कर रहा हूं जो क्लिक होने पर getproduct.php?id=xxx पर कॉल करेगा। मुझे innerHTML भाग दिखाई देने के लिए मिल सकता है, लेकिन मैं php पृष्ठ को वास्तव में कैसे काम करता हूं जो वास्तव में काम करता है?jQuery और AJAX के साथ एक div में एक PHP पृष्ठ कैसे लोड करें?

var id = id; 
document.getElementById("digital_download").innerHTML = 
    "Downloading...Please be patient. The process can take a few minutes."; 
url = getproduct.php?id=id; 
+0

आप किसी भी jQuery या अन्य जे एस ढांचे का उपयोग कर रहे समारोह? –

+0

मैं jquery – Refiking

+1

उग का उपयोग कर रहा हूं ... इच्छा है कि मेरा जवाब लंबे समय से लिखने से पहले मेरा जवाब था। अगली बार, आपको अपनी मूल पोस्ट में उस प्रकार की जानकारी जोड़नी चाहिए। –

उत्तर

6

उदाहरण के लिए आप इसे jQuery के साथ कर सकते हैं।

var id = 1; 
$('#digital_download').html('Downloading...'); // Show "Downloading..." 
// Do an ajax request 
$.ajax({ 
    url: "getproduct.php?id="+id 
}).done(function(data) { // data what is sent back by the php page 
    $('#digital_download').html(data); // display data 
}); 
1

संपादित करें: मूल प्रश्न संदर्भ नहीं दिया था jQuery। इस उत्तर को यहां छोड़कर दूसरों को यह उपयोगी लगेगा।

यहां आप jQuery या प्रोटोटाइप या अन्य जेएस लाइब्रेरी के बिना AJAX अनुरोध के लिए XHR ऑब्जेक्ट का उपयोग करके ऐसा कैसे करेंगे।

var xmlhttp; 
if (window.XMLHttpRequest) { 
    xmlhttp = new XMLHttpRequest(); 
} else { 
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
} 
xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
      document.getElementById('digital_download').innerHTML=xmlhttp.responseText; 
     } 
    } 
    xmlhttp.open("GET", 'getproduct.php?id=' + id,true); 
    xmlhttp.send(); 
} 
11

आप एक div के रूप में इस लाइन का उपयोग अंदर कॉल कर सकते हैं या लोड php पेज: -

$("#content_div").load("ajax/page_url.php"); 

"ajax/page_url.php" php फ़ाइल के अपने एक रिश्तेदार पथ।

तो यहां आप इसे बाहरी यूआरएल के साथ भी बदल सकते हैं।

अगर मैं गलत हूं तो कृपया आपको ज्ञान साझा करें।

+2

यकीन नहीं है कि यह स्वीकार्य उत्तर क्यों नहीं है। कम कोड और काम करता है। – Andrew

0

आप उपयोग कर सकते हैं पाने या पोस्ट अनुरोध क्वेरी

$.ajax({ 
type: "POST", 
url: url, 
data: data, 
success: success, 
dataType: dataType 
}); 

example

1

ऐसे कई तरीके हैं जिसके द्वारा आप एक प्रभाग में एक पृष्ठ लोड कर सकते हैं कर रहे हैं का उपयोग कर।

बहुत विधि

var xmlhttp; 
    if (window.XMLHttpRequest) { 
     xmlhttp = new XMLHttpRequest(); 
    } else { 
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     } 

xmlhttp.onreadystatechange = function() { 
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
     document.getElementById('digital_download').innerHTML=xmlhttp.responseText; 
    } 
} 
    xmlhttp.open("GET", 'getproduct.php?id=' + id,true); 
    xmlhttp.send(); 
} 

है यह कोई बाहरी संदर्भ के साथ एक विशिष्ट विधि है। एक कंटेनर डोम में एचटीएमएल का एक टुकड़ा लोड:

आप संदर्भ के साथ जाना है, तो वहाँ jQuery

साथ
  • लोड एक ajax कॉल करने के लिए 5 तरीके() कर रहे हैं।
  • jQuery.getJSON(): जीईटी विधि के साथ एक JSON लोड करें।
  • jQuery.getScript(): एक जावास्क्रिप्ट लोड करें।
  • jQuery.get(): यदि आप एक GET कॉल करना चाहते हैं और प्रतिक्रिया के साथ बड़े पैमाने पर खेलना चाहते हैं तो इसका उपयोग करें।
  • jQuery.post(): यदि आप पोस्ट कॉल करना चाहते हैं और कुछ कंटेनर डोम को प्रतिक्रिया लोड नहीं करना चाहते हैं तो इसका उपयोग करें।
  • jQuery.ajax(): एक्सएचआर विफल होने पर आपको कुछ करने की आवश्यकता होने पर इसका उपयोग करें, या आपको फ्लाई पर AJAX विकल्प (उदा। कैश: सत्य) निर्दिष्ट करने की आवश्यकता है।

0

हाय आप नीचे दिए गए समारोह इस यह सफलता पर सर्वर से डेटा लोड करता है प्रदर्शन करने के लिए कॉल कर सकते हैं आप बना सकते हैं असफल रूप में अच्छी तरह

function setValue(Id) { 
document.getElementById("digital_download").innerHTML = 
"Downloading...Please be patient. The process can take a few minutes."; 
var data1 = { 
     message: Id, 
    }; 

    $.ajax({ 
     data: data1, 
     type: 'GET', 
     url: "http://urltoscript/index.php", 
    cache: false, 
     dataType: "json", 
     crossDomain: true, 
     success: function(data) { 
     console.log("Response for cancel is: " + data); 

    document.getElementById("digital_download").innerHTML = data 

     } 
    }); 

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