...

View Full Version : If any form element is changed - update ddl value...Help????



fiorano
05-25-2009, 09:12 AM
Hi,

If any form element is changed/updated is it possible to change the value of one ddl?

What I would like to do is if the user changes any value on the form then change a dropdownlist (ddl_status) to a value of "Being Worked On"

Im working in Asp 2.0

Thanks



Fiorano

Old Pedant
05-25-2009, 08:37 PM
The ASP 2.0 (and I assume you *really* mean ASP.NET 2.0) is irrelevant.

This would be completely a client-side javascript solution.

It's not hard, just tedious. You have to put an onchange="this.form.ddl_status.selectedIndex=0;" into each form field.

For form field types that don't support onchange (e.g., a set of radio buttons) you'd put the same JS code into their onclick handlers. I can't think of any form field types offhand that you couldn't manage with one or the other of those.


<form ...>
<input type=text name=xxx onchange="this.form.ddl_status.selectedIndex=0;"/>
<input type=radio name=yyy onclick="this.form.ddl_status.selectedIndex=0;"/>
<textarea name=zzz onchange="this.form.ddl_status.selectedIndex=0;"></textarea>
...
<select name="ddl_status">
<option>Being Worked On</option>
<option>Finished</option>
</select>
</form>

Naturally, if "Being Worked On" is not the first <option> in the <select> then change the 0 for selectedIndex as appropriate.

And naturally you could make a function that would do the same thing and invoke the function from each place. Might make it look neater, but wouldn't change the work or the effect.

Philip M
05-25-2009, 09:36 PM
There is a slight problem in that although changing a form element will change the dll selected index, the user can immediately alter it back again. Perhaps the following is what is wanted, although in truth I am finding it hard to see the purpose. But of course the dll could be re-enabled by something if required.



<select id = "fruits">
<option value = "1"> Apple<br>
<option value = "2"> Pear<br>
<option value = "3"> Being Worked On<br>
</select>
<br><br>
<input type = "button" value = "change" onclick = "changeSel()">

<script type = "text/javascript">
function changeSel() {
document.getElementById("fruits").selectedIndex = 2;
document.getElementById("fruits").disabled = true;
}

</script>

As you say, the button should be replaced in evey form field instance by a call to the function.

Old Pedant
05-25-2009, 09:53 PM
I was assuming that the purpose of the DDL was that the user is *REQUIRED* to change it from "Being Worked On" to "Form Completed" as confirmation that he/she really did check that all the needed changes had been applied.

If the user is presented with an already filled out (or partially filled out) <form>, then this kind of makes sense. He/she can't hit the SUBMIT button until confirming that he/she had checked everything twice.

Seems to me, though, that there would be better things to use than a <SELECT> for this purpose. For example, maybe just a checkbox that says "I certify that I have double checked all the stuff in this form and it's all correct and you can fire me immediately if I screwed up." And every time there is a change, the code unchecks the box. Oh...and the submit button is of course disabled until the box is checked.

fiorano
05-26-2009, 10:59 AM
There is a slight problem in that although changing a form element will change the dll selected index, the user can immediately alter it back again. Perhaps the following is what is wanted, although in truth I am finding it hard to see the purpose. But of course the dll could be re-enabled by something if required.



<select id = "fruits">
<option value = "1"> Apple<br>
<option value = "2"> Pear<br>
<option value = "3"> Being Worked On<br>
</select>
<br><br>
<input type = "button" value = "change" onclick = "changeSel()">

<script type = "text/javascript">
function changeSel() {
document.getElementById("fruits").selectedIndex = 2;
document.getElementById("fruits").disabled = true;
}

</script>

As you say, the button should be replaced in evey form field instance by a call to the function.

Hi, Ive gone for this option - many thanks for your help.

Just one question - Ive tried using W as the selected value eg;


<select id = "list_status">
<option value = "P">Pending<br>
<option value = "W">Worked On<br>
<option value = "C">Closed<br>
</select>
<br><br>
<input type = "button" value = "change" onclick = "changeSel()">

<script type = "text/javascript">
function changeSel() {
document.getElementById("list_status").selectedIndex = "W";
document.getElementById("list_status").disabled = true;
}

</script>

But it doesnt seem to like using Letters instead of numbers - any idea why?

Fiorano

Philip M
05-26-2009, 11:41 AM
But it doesnt seem to like using Letters instead of numbers - any idea why?



Because selectedIndex is by definition a numeric value.

Change it to:-

document.getElementById("list_status").value = "W";

fiorano
05-26-2009, 11:52 AM
Because selectedIndex is by definition a numeric value.

Change it to:-

document.getElementById("list_status").value = "W";

Excellent - many many thanks for your help on this!!!!!!!!!!!!!!!!!!!!!

Best Regards,
Fiorano

adios
05-26-2009, 06:30 PM
http://www.codingforums.com/showthread.php?p=819380

fiorano
05-27-2009, 11:36 AM
Hi again,

ive had a little problem with this. I need to reference the list in the vb code file behind the aspx page. To due this I have to set the run="server" attribute :

<SELECT id="list_status" name="list_status" runat="server">

however now the function isnt changing the select list to the required value - if I take out the runat server attribute - it works.

Please help.........!

Fiorano

adios
05-27-2009, 07:24 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>untitled</title>
<script type="text/javascript">

function form_is_dirty(oForm)
{
var el, opt, hasDefault, i = 1, j;
while (el = oForm.elements[i++])
{
switch (el.type)
{
case 'text' :
case 'textarea' :
case 'hidden' :
if (!/^\s*$/.test(el.value) && el.value != el.defaultValue)
{
return true;
}
break;
case 'checkbox' :
case 'radio' :
if (el.checked != el.defaultChecked)
{
return true;
}
break;
case 'select-one' :
case 'select-multiple' :
j = 0, hasDefault = false;
while (opt = el.options[j++])
{
if (opt.defaultSelected)
{
hasDefault = true;
}
}
j = hasDefault ? 0 : 1;
while (opt = el.options[j++])
{
if (opt.selected != opt.defaultSelected)
{
return true;
}
}
break;
default :
break;
}
}
return false;
}

function trackChgs()
{
var f = document.getElementById('f1');
f.list_status.value = (form_is_dirty(f)) ?
'Being Worked On' : 'done';
}

window.onload = function()
{
var f = document.getElementById('f1');
f.onclick = trackChgs;
f.onkeyup = trackChgs;
f.onmouseup = trackChgs;
}

</script>
</head>
<body>
<form id="f1">
<input type="text" name="list_status" value="done" runat="server" readonly="readonly" style="font:bold 12px monospace;border:none;">
<br />
<br />
<input type="text" /><br /><br />
<textarea rows="3" cols="8">feh!</textarea><br /><br />
<input type="hidden" value="foo" />
<input type="checkbox" checked="checked" />
<input type="checkbox" /><br /><br />
<input type="radio" name="r1" checked="checked" />
<input type="radio" name="r1" /><br /><br />
<select>
<option value="1">blah 1</option>
<option value="2">blah 2</option>
<option value="3">blah 3</option>
</select><br /><br />
<select multiple="multiple">
<option value="4">blah 1</option>
<option value="5" selected="selected">blah 2</option>
<option value="6" selected="selected">blah 3</option>
</select>
<br /><br /><br />
<input type="reset" value="RESET" onclick="return confirm('Reset all fields?')" />
<input type="submit" value="SUBMIT" />
</form>
</body>
</html>

Not entirely sure what you need here, but adding event handlers to every form input is pointless. That's why there are default value properties.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum