handling a form slections

Discussion in 'PHP' started by aleminio, Jul 22, 2009.

0
  1. #1
    i have a form with a Drop Down List, the user is required to select some values from that drop down list.
    those values are being displayed in a selection form so the user can remove what he has already selected before submitting the form.
    but when submitting the form, i want all those selected values to be
    sent to the server without selecting them again. how am i able to do that?
     
    aleminio, Jul 22, 2009 IP
  2. crath

    crath Well-Known Member

    Messages:
    661
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    100
    #2
    I need a bit clearer description to answer the question, could you post one? Or a link to an example of what you are trying to accomplish?
     
    crath, Jul 22, 2009 IP
  3. ezprint2008

    ezprint2008 Well-Known Member

    Messages:
    611
    Likes Received:
    15
    Best Answers:
    2
    Trophy Points:
    140
    Digital Goods:
    1
    #3
    I think he means the page is refreshing every time they select something, and that resets the formerly selected dropdown because of <input SELECTED>

    You need a different type of dropdown box with a memory (javascript) so that it saves the history of what was already selected. UInless you save the selection as say a SESSION and out put the variable and make the selection box disappear when it has already been selected. If the user wants to change the selection already made they can click a delete box next to the displayed selected value, causing the dropdwon to reappear.

    Try to do this in AJAX - it will be less confusing, it wont refresh the whole page etc.
    Or .. if you dont need the dropdown selections to be individually refreshed, you can do a standard javascript dropdown and dont trigger the change until the last selection has been made onChange="this.form.submit"
     
    ezprint2008, Jul 22, 2009 IP
  4. zandigo

    zandigo Greenhorn

    Messages:
    71
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    16
    #4
    I don't think this is AJAX matter. He just needs some javascript to hide selected option in selection input. My idea is use onChange, then add hidden field to a form.

    So exactly, what will work is create a drop down list. Just onChange handlers to append, or add new hidden element to forms[0], and at the same time, remove the option that is selected.

    When submitted, the forms[0] will include the hidden fields, from drop down list.

    Am i at the wrong side of the question?
     
    zandigo, Jul 22, 2009 IP
  5. asmon

    asmon Member

    Messages:
    56
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    41
    #5
    k, i'll just upload a screenshot.
    [​IMG]

    anything the user selects is being added to the selection box
    when i submit the form, i want all those values in that selection box to be submitted without selecting them.

    but i guess it's a js thing.
     
    asmon, Jul 23, 2009 IP
  6. zandigo

    zandigo Greenhorn

    Messages:
    71
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    16
    #6
    Okay, let me spend some time working with js thingee, and will post script here if I get it right :D. Not promise I can make it though.

    Okie, Im back, I have finished and testes it. It worked fine. But note that the true value will be sent is not from the Selection. Whenever users make a select, a new hidden field will be created with the same name. You just need to distinguish them somehow by server-side script. When users remove, the hidden fields will be deleted. That's all needed.

    I just like little exercise like this.

    Hope this help. BTW, you have your own screen shot. Does not that mean you have it work fine already? And I just do unnecessary work? :confused:

    <header>
<script>
function addselect() {
	value= document.getElementById('network').value;
	var sel= document.getElementById('netw');
	if (value!= '0') {
		if ((sel.length==1) && (sel.options[0].value==0)) {
			sel.options[0]= null;
		}
		sel.options[sel.length]= new Option(value, value);
		document.getElementById('selection').innerHTML+="<input type=hidden id='"+value+"' name='website' value='"+value+"'>";
	}
}

function removes() {
	var sel= document.getElementById('netw');
	val= sel.value;
	if (val != '') {
		var hid= document.getElementsByName('website');
		for (i=0; i<= hid.length-1; i++) {
			if (hid[i].value== val) {
				id= hid[i].id;
			}
		}
		var rev = document.getElementById(id);
		rev.parentNode.removeChild(rev);
		for (i=0; i<= sel.length; i++) {
			if (sel.options[i].value== val) {
				sel.options[i] = null;
			}
		}
		if (sel.length == 0) {
			sel.options[0]= new Option('Please choose the Website', '0')
		}
	} 
}
</script>
</header>
<body>
<select id='network' onChange="addselect()">
<option value='0'>Choose One</option>
<option value='Google'>Google</option>
<option value='Bing'>Bing</option>
<option value='Yahoo'>Yahoo</option>
<option value='Ask'>Ask</option>
<option value='Wiki'>Wiki</option>
</select>
<br /><br />Your choice(s)<br />
<br />
<form name=form id='fom' method=POST>

<button type="button" onclick="removes()">Remove</button><br>

<SELECT NAME="Network"id='netw' MULTIPLE size=8 >
<option value='0'> Please choose the Website</option>
</SELECT>

<div id="selection"></div>

<input type="submit" value="Submit">
</form>


</body>
    HTML:
     
    zandigo, Jul 23, 2009 IP