Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #18103

Re: Matching arbitrary pairs of elements

Show all headers | View raw

On Friday, January 11, 2013 8:32:36 PM UTC+10, D.M. Procida wrote:
> D.M. Procida <real-not-anti-spam-address@apple-juice.co.uk> wrote:
> 
> > I am trying to create a widget that when a certain option in a <select>
> > is chosen, a previously-hidden input field is shown.
> 
> Thanks for the replies.
> 
> I've got a working solution: <http://jsfiddle.net/GudQP/22/>
> 
> The JavaScript I needed was:

You mean the javascript you decided to use.

> 
> // hide the input_url field by default
> 
> $('div[class|="form-row field-input_url"]').hide();
> 
> // when the select is changed:
> $('select[id|="id_links_item"]').on('change', function () {
> 
>   // get the value of the select
> 
>   var $this = $(this),
> 
>     val = $this.val();
> 
>   // should we hide or display?
> 
>   if (val == "40") {
> 
>     var hideshow = "block";
> 
>   } else {
> 
>     var hideshow = "hide";
> 
>   };

Your original issue was to identify a related element when the value of a select element is changed. If you use an ID to relate the elements (or name since they are form controls) then the issue is much simpler. E.g. since there are a number of these, you might have:

    <select name="select-0"...>
        ...
    </select>

    <input name="input-0"...>

Then the listener can be something like:

    var inputID = 'input' + this.id.split('-')[1];
    document.getElementById(inputID).style.display = this.value == 40? '' : 'none'; 

or if you use a name:

    var inputName = 'input' + this.name.split('-')[1];
    this.form[inputName].style.display = this.value == 40? '' : 'none'; 

You can apply a similar approach to the rest of it.


>   // find the relevant input_url field, and apply the 
>   // hide/show CSS value
>   $this.closest('div[class|="form-row
> 
> field-destination_content_type"]').nextAll('div[class|="form-row
> field-input_url"]').css('display', hideshow);
> });

Using a selector as you have means that if document layout changes, your code may or may not break depending on the type of change. That may be difficult to find and debug.

-- 
Rob

Back to comp.lang.javascript | Previous | Next — Previous in thread | Find similar | Unroll thread

Thread

Matching arbitrary pairs of elements real-not-anti-spam-address@apple-juice.co.uk (D.M. Procida) - 2013-01-08 19:41 +0000
  Re: Matching arbitrary pairs of elements Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-01-09 00:36 +0100
    Re: Matching arbitrary pairs of elements real-not-anti-spam-address@apple-juice.co.uk (D.M. Procida) - 2013-01-09 11:46 +0000
      Re: Matching arbitrary pairs of elements Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-01-09 18:24 +0100
    Re: Matching arbitrary pairs of elements John G Harris <niam@jghnorth.org.invalid> - 2013-01-09 16:34 +0000
  Re: Matching arbitrary pairs of elements "Leonardo Azpurua" <leonardo@exmvps.org> - 2013-01-08 23:11 -0430
    Re: Matching arbitrary pairs of elements Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-01-16 12:49 +0100
      Re: Matching arbitrary pairs of elements Tim Streater <timstreater@greenbee.net> - 2013-01-16 12:47 +0000
        Re: Matching arbitrary pairs of elements Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-01-16 14:27 +0100
          Re: Matching arbitrary pairs of elements Tim Streater <timstreater@greenbee.net> - 2013-01-16 13:52 +0000
            Re: Matching arbitrary pairs of elements Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-01-16 18:48 +0100
              Re: Matching arbitrary pairs of elements Tim Streater <timstreater@greenbee.net> - 2013-01-16 17:58 +0000
              Re: Matching arbitrary pairs of elements John G Harris <niam@jghnorth.org.invalid> - 2013-01-17 14:30 +0000
  Re: Matching arbitrary pairs of elements Jeff North <jnorthau@yahoo.com.au> - 2013-01-10 13:11 +1100
  Re: Matching arbitrary pairs of elements real-not-anti-spam-address@apple-juice.co.uk (D.M. Procida) - 2013-01-11 10:32 +0000
    Re: Matching arbitrary pairs of elements RobG <rgqld@iinet.net.au> - 2013-01-13 22:36 -0800

csiph-web