|
[x]
Posted via EE Mobile
|
|
| Search, ask, and monitor your questions on the go with EE Mobile. Visit Experts Exchange from your mobile device and never be out of touch again. |
|
|
|
|
Asked by pigmentarts in JavaScript
Quick question. I the moment the following code adds to a list ready for uploading upon browsing and picking a file, I have added a new 'add' submit button I dont want this button to submit the page but to do what currently happens when a user picks a file i.e. adds file to list.
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
|
<script>
function MultiSelector( list_target, max ){
this.list_target = list_target;this.count = 1;
this.id = 1;
if( max ){
this.max = max;
} else {
this.max = -1;
};
this.addElement = function( element ){
if( element.tagName == 'INPUT' && element.type == 'file' ){
element.name = '<cfoutput>#getInputname()#</cfoutput>' + this.id++;
element.multi_selector = this;
element.onchange = function(){
var new_element = document.createElement( 'input' );
new_element.type = 'file';
this.parentNode.insertBefore( new_element, this );
this.multi_selector.addElement( new_element );
this.multi_selector.addListRow( this );
this.style.position = 'absolute';
this.style.left = '-1000px';
};
if( this.max != -1 && this.count >= this.max ){
element.disabled = true;
};
this.count++;
this.current_element = element;
} else {
alert( 'Error: not a file input element' );
};
};
this.addListRow = function( element ){
var new_row = document.createElement( 'div' );
var new_row_button = document.createElement( 'input' );
new_row_button.type = 'image';
new_row_button.value = 'Delete';
new_row_button.src = '../../includes/uploadFormCFC/close_btn.gif';
new_row.element = element;
new_row_button.onclick = function(){
this.parentNode.element.parentNode.removeChild( this.parentNode.element );
this.parentNode.parentNode.removeChild( this.parentNode );
this.parentNode.element.multi_selector.count--;
this.parentNode.element.multi_selector.current_element.disabled = false;
//alert('hi');
parent.$("#uploadResponseMsg").empty();
return false;
};
new_row.innerHTML = element.value;
new_row.appendChild( new_row_button );
this.list_target.appendChild( new_row );
parent.$("#uploadResponseMsg").empty();
//alert('hello');
};
};
</script>
<cfoutput>
<!--- This is the form, nothing special here --->
<input id="#getInputid()#" type="file" name="#getInputname()#">
Alt <input id="#getInputid()#alt" type="text" name="#getInputname()#alt">
<input id="#getInputid()#" type="submit" name="#getInputname()#" value="Add">
<!--- This is div to show the user what they just picked --->
<div id="#getListid()#"></div>
<script>
<!-- Create an instance of the multiSelector class, pass it the output target and the max number of files -->
var multi_selector = new MultiSelector(document.getElementById('#getListid()#'), #getNumofrows()#);
<!-- Pass in the file element -->
multi_selector.addElement(document.getElementById('#getInputid()#'));
</script>
|
20091111-EE-VQP-92 - Hierarchy / EE_QW_EXPERT_20070906
