एचटीएमएल: फ़ाइल फ़ील्ड को अन्य फॉर्म में कॉपी करें जिसमें FILE इनपुट फ़ील्ड शामिल है?

Question

मैं यह देखने के लिए आया कि फॉर्म फ़ाइल इनपुट फ़ील्ड मान सुरक्षा कारणों से जावास्क्रिप्ट के साथ सेट नहीं किया जा सकता है।

मैं सिर्फ एक फ़ाइल इनपुट को किसी अन्य रूप में कॉपी करना चाहता हूं और इसे पोस्ट करना चाहता हूं, मैंने चारों ओर एक काम की खोज की और कुछ भी नहीं मिला, क्या यह संभव है?

अद्यतन: मेरे कोड:

function prepareUpload(filevalue){ 

document.getElementById('logo').value =filevalue; 
var mform = document.getElementById('sleeker'); 
    ajaxUpload(mform,'<?php echo base_url(); ?>'); // a methods to upload... 
} 

<input class="input-file-upload" type="file" size="20" name="logodummy" id="logodummy" onchange="prepareUpload(this.value);" /> 

<form action="" method="post" name="sleeker" id="sleeker" enctype="multipart/form-data" onbeforesubmit="return false;"> 
      <p><input type="hidden" name="logo" id="logo" /></p> 
     </form> 

कुछ अन्य thatn फ़ाइल इनपुट ठीक काम कर रहे हैं, और मैं $ _POST साथ प्राप्त कर सकता है, लेकिन $ _FILES मान नहीं है। और यह कोड अकेले ठीक काम कर रहा है। मुझे लगता है कि यह कोय पर्याप्त है?

Answer 1

हां, आप अपने HTML प्रपत्र बाहर <input type="file"> जगह कर सकते हैं, और फिर onChange घटना का उपयोग प्रपत्र पोस्ट हो जाती है कि भीतर एक <input type="hidden"> को भरने के लिए:

<input type="file" 
     onchange="document.getElementById('hidden_file').value = this.value;" /> 

<form method="POST"> 
    <input type="hidden" id="hidden_file" value="" /> 
    <input type="submit" /> 
</form> 

हालांकि आधुनिक ब्राउज़रों में

, आप केवल सक्षम हो जाएगा फ़ाइल नाम तक पहुंचने के लिए, और पूर्ण पथ नहीं। आप इस विषय पर अधिक जानकारी के लिए निम्न स्टैक ओवरफ़्लो पदों जाँच करना चाहते हो सकता है:

• Can’t get the complete address while uploading a file
• How to get the file path from HTML input form in Firefox 3

---

अद्यतन:

मूल प्रश्न मुझे बनाया लगता है कि आपको केवल "फ़ाइल नाम" को किसी अन्य HTML फॉर्म में कॉपी करने की आवश्यकता है, और नहीं ओले <input type="file"> प्रतिनिधित्व।

अद्यतन करने के लिए इसके अलावा, मुझे लगता है आप कुछ इस तरह का मतलब:

<input type="file" 
     onchange="document.getElementById('hidden_file').value = this.value;" /> 

<form method="POST"> 
    <input type="file" id="hidden_file" value="" /> 
    <input type="submit" /> 
</form> 

दुर्भाग्य से काम नहीं होता। यदि आप उपर्युक्त उदाहरण का प्रयास करते हैं तो फ़ायरफ़ॉक्स "Security error code: 1000" वापस आ जाएगा।

कुछ समाधान के लिए के रूप में, आप चेक 'David Dorward रों सुझाव कर सकते हैं:

• Using cloneNode
• Moving the input field with appendChild before submitting the form

Answer 2

आप (appendChild के साथ अन्य फार्म के लिए फ़ाइल इनपुट के लिए कदम सकता है या सम्मिलित करें), फॉर्म सबमिट करें, और उसके बाद इसे वापस ले जाएं।

Answer 3

मैंने गहराई से इसका परीक्षण नहीं किया है, लेकिन ऐसा लगता है कि यह फ़ायरफ़ॉक्स में काम करता है।

उपयोग cloneNode

var copy = file_input.cloneNode(1); 
form2.appendChild(copy); 

Answer 4

बहुत ज्यादा jQuery

में छोड़कर cloneNode के समान xulrunner ब्राउज़र (Firefox) में मैं सफलतापूर्वक निम्नलिखित की तरह कुछ का इस्तेमाल किया है:

$('input:file').clone().appendTo($('#mainform')); 

यह सभी फ़ाइल इनपुट ऑब्जेक्ट्स को id = mainform के साथ फ़ॉर्म में कॉपी करना चाहिए।

क्लोन किए जाने वाले ऑब्जेक्ट्स में आईडी विशेषता का उपयोग करने से बचें। आईडी हमेशा अद्वितीय होना चाहिए।

Answer 5

मुझे एहसास हुआ कि यह पार्टी के लिए देर हो सकती है, लेकिन HTML5 के साथ, आप एक फॉर्म को लक्षित करने के लिए "फॉर्म" विशेषता का उपयोग कर सकते हैं, जैसे [form id = "the_form"] ... [/ form]। ... [इनपुट फॉर्म = "the_form type =" file "... /]