We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 45118
    • 123 Posts
    Hello everyone!

    I have trouble with using two selectboxes that have more or less the same values. Both selectboxes let the user select a dimension; one for projection and the other one for height. Here's part of the form with the selectboxes:
    <form action="[[~[[*id]]]]" method="POST">
    <p>Select a Projection:</p>
    <div>
    <select id="my-select03" name="proj[]" multiple="multiple" onChange="this.form.submit();">
       <option value="6" [[+6_selected]]>Proj = 6" < 7"</option>
       <option value="7" [[+7_selected]]>Proj = 7" < 8"</option>
       <option value="8" [[+8_selected]]>Proj = 8" < 9"</option>
       <option value="9" [[+9_selected]]>Proj = 9" < 10"</option>
       <option value="10" [[+10_selected]]>Proj = 10" < 11"</option>
       <option value="11" [[+11_selected]]>Proj = 11" < 12"</option>
    </select>
    </div>
    <p>Select a Height:</p>
    <div>
    <select id="my-select04" name="height[]" multiple="multiple" onChange="this.form.submit();">
       <option value="6" [[+6_selected]]>Height = 6" < 7"</option>
       <option value="7" [[+7_selected]]>Height = 7" < 8"</option>
       <option value="8" [[+8_selected]]>Height = 8" < 9"</option>
       <option value="9" [[+9_selected]]>Height = 9" < 10"</option>
       <option value="10" [[+10_selected]]>Height = 10" < 11"</option>
       <option value="11" [[+11_selected]]>Height = 11" < 12"</option>
    </select>
    </div>
    </form>
    
    And here's part of the snippet:
    $proj = array();
    if (isset($_POST['proj']) && (!empty($_POST['proj']))) {
        $proj = $_POST['proj'];
    }
    
    $height = array();
    if (isset($_POST['height']) && (!empty($_POST['height']))) {
        $height = $_POST['height'];
    }
    
    $c = $modx->newQuery('Products');
    
    $projArray = array();
    foreach($proj as $s01) {
            $projArray[] = array('proj:LIKE' => $s01.'.'.'%');
            $modx->setPlaceholder($s01 . '_selected', $selected);
    }
    
    $heightArray = array();
    foreach($height as $s04) {
            $heightArray[] = array('height:LIKE' => $s04.'.'.'%');
            $modx->setPlaceholder($s04 . '_selected', $selected);
    }
    
    The value that gets selected finds the products with that dimension, which works fine when I have only one selectbox. With the second one added it goes wrong. For instance when I select a height of 8" < 9", a projection of 8" < 9" gets selected at the same time.
    Is there any way I can do this differently so I can use more than one selectbox?

    Any help is greatly appreciated!

    This question has been answered by BobRay. See the first response.

      • 9768
      • 13 Posts
      What is your onChange= doing?

      The code you present ought to function correctly. What you are telling us is that a value set in "height" is copied to "projection", and nothing visible in your sample is doing that. Hence it must be something else, and my first suspect would be the Javascript invoked by onChange=

      If not that, then you might usefully add something to display the complete $_POST array, which would at least tell you whether the spurious "projection" value is coming from the browser or being generated server-side.
        • 46886
        • 1,154 Posts
        I don't think the values can be the same, what is happening is the user is just re-selecting the value.

        <option value="6"

        Change at least one set of these to 6p or 6h, or change both sets so they are clear.

        The point is, you are giving the user two chances to determine the value of value="6", and when they input a value the second time, it wipes out and replaces the first selection.

        ~~

        Pretty sure I am right about this. The id="my-select03" is not how the data is stored here. The value term is what it goes in the db under. Name value is not as critical, never understood what it is for except adding some data I guess. Messing with what you put in the name="X" doesn't seem to affect anything, its some additional attribute.

        So, when you have 10 users, if you wanted to know the average and mode of the set you would search the db for value="6" and output that or average that.

        Assuming I haven't gone wobbly so far, I would venture that you may not be setting this up right if you want to be able to output the user's data...don't mean to criticize, and now i feel less sure, let's wait for someone more definitive to come by. [ed. note: nuan88 last edited this post 10 years, 6 months ago.]
          • 45118
          • 123 Posts
          Quote from: fjpb at Mar 11, 2016, 05:53 AM
          What is your onChange= doing?
          onChange="this.form.submit(); 
          is posting the value that is selected. For instance when a user selects Proj = 6" < 7", the value "6" gets submitted. In the snippet that value of "6" goes into the array:
          array('proj:LIKE' => $s01.'.'.'%')
          and finds all the products that have a projection of 6.xxx inches.
            • 45118
            • 123 Posts
            Quote from: nuan88 at Mar 11, 2016, 07:18 AM
            I don't think the values can be the same, what is happening is the user is just re-selecting the value.

            <option value="6"

            Change at least one set of these to 6p or 6h, or change both sets so they are clear.
            Thanks, I've considered (and tested) that, but than the problem is how to put that value into an array so I can find the right products. This is what I use now
            array('proj:LIKE' => $s01.'.'.'%')
            where $s01 is the value, which doesn't work if the value is 6p.
              • 45118
              • 123 Posts
              Quote from: nuan88 at Mar 11, 2016, 07:18 AM
              Pretty sure I am right about this. The id="my-select03" is not how the data is stored here. The value term is what it goes in the db under. Name value is not as critical, never understood what it is for except adding some data I guess. Messing with what you put in the name="X" doesn't seem to affect anything, its some additional attribute.
              id="my-select03" is to make the selectbox work properly with jquery.
              Since I'm using several selectboxes in my form I have to indicate a name (name="proj[]") so the snippet can distinguish between the different submits.
              • discuss.answer
                • 3749
                • 24,544 Posts
                Your two sets of "selected" placeholders each need a prefix so the code doesn't set both of them at once.
                  Did I help you? Buy me a beer
                  Get my Book: MODX:The Official Guide
                  MODX info for everyone: http://bobsguides.com/modx.html
                  My MODX Extras
                  Bob's Guides is now hosted at A2 MODX Hosting
                  • 45118
                  • 123 Posts
                  Quote from: BobRay at Mar 11, 2016, 05:38 PM
                  Your two sets of "selected" placeholders each need a prefix so the code doesn't set both of them at once.
                  This works beautifully!! Thanks Bob!
                  Here's the updated code:
                  <form action="[[~[[*id]]]]" method="POST">
                  <p>Select a Projection:</p>
                  <div>
                  <select id="my-select03" name="proj[]" multiple="multiple" onChange="this.form.submit();">
                     <option value="6" [[+p6_selected]]>Proj = 6" < 7"</option>
                     <option value="7" [[+p7_selected]]>Proj = 7" < 8"</option>
                     <option value="8" [[+p8_selected]]>Proj = 8" < 9"</option>
                     <option value="9" [[+p9_selected]]>Proj = 9" < 10"</option>
                     <option value="10" [[+p10_selected]]>Proj = 10" < 11"</option>
                     <option value="11" [[+p11_selected]]>Proj = 11" < 12"</option>
                  </select>
                  </div>
                  <p>Select a Height:</p>
                  <div>
                  <select id="my-select04" name="height[]" multiple="multiple" onChange="this.form.submit();">
                     <option value="6" [[+h6_selected]]>Height = 6" < 7"</option>
                     <option value="7" [[+h7_selected]]>Height = 7" < 8"</option>
                     <option value="8" [[+h8_selected]]>Height = 8" < 9"</option>
                     <option value="9" [[+h9_selected]]>Height = 9" < 10"</option>
                     <option value="10" [[+h10_selected]]>Height = 10" < 11"</option>
                     <option value="11" [[+h11_selected]]>Height = 11" < 12"</option>
                  </select>
                  </div>
                  </form>

                  $proj = array();
                  if (isset($_POST['proj']) && (!empty($_POST['proj']))) {
                      $proj = $_POST['proj'];
                  }
                   
                  $height = array();
                  if (isset($_POST['height']) && (!empty($_POST['height']))) {
                      $height = $_POST['height'];
                  }
                   
                  $c = $modx->newQuery('Products');
                   
                  $projArray = array();
                  foreach($proj as $s01) {
                          $projArray[] = array('proj:LIKE' => $s01.'.'.'%');
                          $modx->setPlaceholder('p'.$s01 . '_selected', $selected);
                  }
                   
                  $heightArray = array();
                  foreach($height as $s04) {
                          $heightArray[] = array('height:LIKE' => $s04.'.'.'%');
                          $modx->setPlaceholder('h'.$s04 . '_selected', $selected);
                  }
                    • 3749
                    • 24,544 Posts
                    Perfect solution. I'm glad you got is sorted. smiley
                      Did I help you? Buy me a beer
                      Get my Book: MODX:The Official Guide
                      MODX info for everyone: http://bobsguides.com/modx.html
                      My MODX Extras
                      Bob's Guides is now hosted at A2 MODX Hosting