Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    Registered User
    Join Date
    May 2009
    Posts
    4
    Thanks
    2
    Thanked 0 Times in 0 Posts

    If any form element is changed - update ddl value...Help????

    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

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,447
    Thanks
    76
    Thanked 4,372 Times in 4,337 Posts
    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.
    Code:
    <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.

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,988
    Thanks
    203
    Thanked 2,536 Times in 2,514 Posts
    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.


    Code:
    <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.
    Last edited by Philip M; 05-25-2009 at 08:39 PM. Reason: Typo

  • Users who have thanked Philip M for this post:

    fiorano (05-26-2009)

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,447
    Thanks
    76
    Thanked 4,372 Times in 4,337 Posts
    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.

  • #5
    Registered User
    Join Date
    May 2009
    Posts
    4
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Philip M View Post
    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.


    Code:
    <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;

    Code:
    <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

  • #6
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,988
    Thanks
    203
    Thanked 2,536 Times in 2,514 Posts
    Quote Originally Posted by fiorano View Post
    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";

  • Users who have thanked Philip M for this post:

    fiorano (05-26-2009)

  • #7
    Registered User
    Join Date
    May 2009
    Posts
    4
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Philip M View Post
    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

  • #8
    Senior Coder
    Join Date
    Jun 2002
    Posts
    1,404
    Thanks
    2
    Thanked 32 Times in 32 Posts

  • #9
    Registered User
    Join Date
    May 2009
    Posts
    4
    Thanks
    2
    Thanked 0 Times in 0 Posts
    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

  • #10
    Senior Coder
    Join Date
    Jun 2002
    Posts
    1,404
    Thanks
    2
    Thanked 32 Times in 32 Posts
    Code:
    <!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.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •