5
बिना jQuery का उपयोग करके फ़ाइलें मैं एक अद्यतन प्रोफाइल पेज की है। इसमें तीन रूप हैं, यह किसी एक फॉर्म को दिखाने का अनुरोध प्राप्त करता है। update_profile.php?type=profile जैसा उपयोगकर्ता संपादित अपने प्रोफ़ाइल, update_profile.php?type=settings उपयोगकर्ता संपादित अपने खाते की सेटिंग्स बदल सकते हैं।अपलोड कर रहा है पृष्ठ ताज़ा
प्रकार: प्रोफ़ाइल एक फ़ाइल इनपुट है, मैं उन पृष्ठ ताज़ा बिना अपलोड करने में सक्षम होना चाहता हूँ। अब यह AJAX का उपयोग करके किया जा सकता है, इसलिए मुझे एक वर्कअराउंड की आवश्यकता होगी। मैंने आईफ्रेम विधि, xhr2 विधि और html5 + AJAX विधि की कोशिश की है जिसे कोई स्टैक ओवरफ्लो पर पोस्ट करता है।
इसलिए यदि कोई विस्तृत चरण मुझे लगता है कि सराहना करेंगे में मेरे साथ बातें समझाने की तरह होगा।
$(function(){
$('form[name=update_stuff]').on("submit", function(e){
e.preventDefault();
$.ajax({
url: 'process.php',
type: 'POST',
data: $(this).serialize(),
success: function(data){
$('#emptydiv').html(data);
}
});
});
});
मैं php में $ _FILES का उपयोग फ़ाइल नाम हो और इसके विस्तार और आकार को सत्यापित करने के:
<script type='text/javascript'>
function nouser() {
$().toastmessage('showToast', {
text : 'The user does not exist',
sticky : true,
position : 'middle-center',
type : 'error',
closeText: '',
close : function() {
console.log("toast is closed ...");
}
});
}
</script>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Update Profile</title>
<link rel="shortcut icon" type="image/png" href="includes/template/images/favicon.png" />
<link rel="stylesheet" type="text/css" href="includes/template/css2/style.css" />
<link rel="stylesheet" type="text/css" href="includes/jquery/toast/resources/css/jquery.toastmessage.css" />
<link rel="stylesheet" type="text/css" href="includes/jquery/notification/css/jquery_notification.css" />
<script type="text/javascript" src="includes/jquery/jquery_v_1.4.js"></script>
<script type="text/javascript" src="includes/jquery/toast/javascript/jquery.toastmessage.js"></script>
<script type="text/javascript" src="includes/jquery/notification/js/jquery_notification_v.1.js"></script>
<script type="text/javascript" src="includes/jquery/auto_resize/resize.js"></script>
<script type="text/javascript" src="includes/jquery/jquery_form.js"></script>
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="css2/ie.css" />
<![endif]-->
</head>
<body>
<div class="topBar" >
<marquee>Welcome to The Marshall Meme. Your IP Adress is 127.0.0.1 You are logged in as marshall</marquee>
</div>
<br />
<div class="logo" >
<a href="http://www.themarshallmeme.com"><img src="includes/template/images/logo.png"/></a><br/>
</div>
<center>
<div id="wrap">
<br>
<div class="wrapbg">
<span class="corners-top"><span></span></span>
<a class='nav' href='index.php'>Home</a>
<a class='nav' href='whoson.php'>Whos online</a>
<a class='nav' href='logout.php'>Logout</a> <a class='nav' href='forum.php'>Forum</a>
<span class="corners-bottom"><span></span></span>
</div><div class="wrapbg">
<span class="corners-top"><span></span></span>
<div id="content">
Web name
<hr class="hr1" />
<br />
<ul>
<a href='whats_new.php'><button class='action greenbtn'><span class='label'>Whats new?</span></button></a><a href='friend_requests.php'><button class='action redbtn'><span class='label'>Friend requests</span></button></a><a href='update_profile.php?type=profile'><button class='action greenbtn'><span class='label'>Edit profile</span></button></a><a href='update_profile.php?type=settings'><button class='action bluebtn'><span class='label'>Security Settings</span></button></a><a href='update_profile.php?type=changepass'><button class='action greenbtn'><span class='label'>Change password</span></button></a></div>
<span class="corners-bottom"><span></span></span>
</div><div id='emptydiv'> </div>
<div class="wrapbg">
<span class="corners-top"><span></span></span>
<div id="content"><br/>
Update profile
<hr class='hr1'>
<form action='' method="POST" enctype="multipart/form-data">
<table>
Profile picture<br>
<img src="uploads/profile_pics/TIFF_06_liam-neeson_01.jpg"></img>
Thumbnail
<img src="uploads/profile_pics_small/TIFF_06_liam-neeson_01.jpg" ?></img>
<tr><td class="lTxt">Change profile picture:</td> <td><input type="file" name="pic"/></td></tr>
<tr><td class="lTxt">About me:</td> <td><textarea name='about'>Updating my profile :|
fuck yeaaaa</textarea></td></tr>
<tr><td class="lTxt">Interests:</td> <td><textarea name='interests'>I love web development with jquery and php.
Really awesome! yea</textarea></td></tr>
<input type='hidden' name='action' value='profile'/>
<tr><td></td><td><button id="update_profile" name='update' class="action greenbtn"><span class="label">Update profile</span></button></td></tr>
</table>
</form>
</a></div>
<span class="corners-bottom"><span></span></span>
</div> <script type='text/javascript'>
$(function(){
$('form[name=update_stuff]').on("submit", function(e){
e.preventDefault();
$.ajax({
url: 'process.php',
type: 'POST',
data: $(this).serialize(),
success: function(data){
$('#emptydiv').html(data);
}
});
});
});
</script>
</div>
</br>
<div id="footer">
Copyright © 2010-2011, <a href="http://www.themarshallmeme.com">Marshall Meme</a>. All rights reserved.<br>
There are no users online</div>
</div>
</center>
</body>
</html>
यहाँ jQuery कोड मैं सामान्य रूप से फॉर्म जमा करने के लिए उपयोग करते हैं: यहाँ मेरी एचटीएमएल है सर्वर पक्ष, तो मुझे उसमें जानकारी चाहिए। यह कैसे किया जा सकता है? क्या मुझे प्रोफ़ाइल को अपडेट करने के लिए फॉर्म नाम बदलने की आवश्यकता होगी और उसी पृष्ठ के अन्य रूपों की तुलना में इसके लिए एक अलग कोड लिखना होगा?
पृष्ठभूमि अपलोड करने वाले एक फ्लैश एप्लेट या एक छिपा iframe का उपयोग होना आवश्यक है एक पृष्ठ के अग्रभूमि से अपलोड छुपाने के लिए। आप अपने आप को अपलोड करने के लिए AJAX का उपयोग नहीं कर सकते हैं, क्योंकि AJAX फ़ाइलों का समर्थन नहीं करता है, केवल मानक फॉर्म डेटा/स्ट्रिंग्स। –
यही कारण है कि मैं कैसे मैं iframes का उपयोग कर ऐसा कर सकते हैं पूछा, मैं सिर्फ विस्तृत चरण यह करने के लिए क्योंकि Ive कई ट्यूटोरियल और भी irc की कोशिश की चाहते मेरे अंतिम उपाय stackoverflow T_T –