3 Replies Latest reply: Apr 15, 2013 8:26 AM by whatalotofrubbish RSS

    Creating buttons for a search page

    whatalotofrubbish Community Member

      I have a site that has over 3K records that are searchable.

      I need to create a new method of the drop down list using buttons, as drop down lists do not work well on a telephone.

      The site is http://www.tyneships.co.uk, so if you have a look there you will see my problem.

      So I thought that if I narrowed the options down to a set of buttons, each with a single letter on it, I could create an on the fly page for each letter that exists, as the contents change regularly.

      I have a recordset, and have written code that reads it in and prints out each available first letter of all possible search items. I need to then create a button using php that holds this letter.

      In html, the following code would be used:

       

      <input  type="text" name="button" value="A" />

       

      I have the value of "A" in a variable called $b, which is not a post variable

       

      How do I get $b to appear in place of the "A".

      I do not know if it is a syntax error problem or what, but I would have thought that there should be a way to do it.

      I have investigated the newt_button(x,y,"button_name") function, which is supposed to create a new button at location x,y  but it does not seem to exist in my version of Xammp php (5.3.1).

      Can anyone help?

       

      Dreamweaver 5.5 on win 7 OS

        • 1. Re: Creating buttons for a search page
          SnakEyez02 CommunityMVP

          I tried searching through your site and I don't see the drop-downs you are referring to.  Drop-downs work just fine on phones from Android and iOS.  I've never experienced any issues with them.  What issue are you experiencing with them?

           

          As for the other values, if you want $b to appear where your "A" is, just do <?php echo $b; ?>  where the "A" is.

           

          Unfortunately, we cannot see syntax issues as PHP is processed prior to the page load so we would need you to post the source code if you wish for us to help with a syntax error.

          • 2. Re: Creating buttons for a search page
            whatalotofrubbish Community Member

            One of the drop downs is at http://tyneships.co.uk/phpfiles/findall.php5 which lists all the 3K+ records. All others appear on the Search menu item on the left of most pages other than the splash page.

            I find these very dificult to use on a mobile, without having to zoom in.

            It occurred to me that creating a set of buttons would be very helpful to users, as the whole set can be filtered using the same numberof pages that are needed using a drop down list.

            The grid below is a result of a quick search of all records listing the first letters of all types in the data, and displaying them as buttons.

            Notice that I, J, Q, X and Z do not appear in the grid, as there are no types in the database beginning with these letters.

            As a result, a click on any of these buttons should produce valid data. No error checking is yet in place.

            Capture.JPG

            Above is my first attempt to create the buttons on a grid using php. Ignore the uU buttons - garbage in the data file now sorted on line.

            The working source code is shown below, without the data file access code or css. The original code that I used suffered from logic errors and syntax errors, now fixed.

             

            <body>

            <form action="get_types.php" method="get" name="type_form" target="_self">

            <table border="1" cellpadding="2" cellspacing="2" class="purple">

             

            <?php

            $rowcount = 1;

            do {

            $b= ($row_Recordset1['type']); // Read the record

            $b = left("$b",1); //get its first character

              if ($old <> $b) { // then we have found a new letter so print it as a button

            echo '<td> <input type="button" name="button" value="' . $b . '" </td> ' ;

            if ($rowcount <=6) { // count the columns in the row. If less than 6 add 1

                      $rowcount++;

                      }

            $old = $b; //reset the old character to the new one

            }

            if ($rowcount == 6) {// if its 6, we are at the end of the row

                       echo '<tr>';  // end the row

                       $rowcount = 1;//reset it to 1

            }

              ?>

               <?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>

              </table>

            </form>

            <span>

            Click the 1st letter of the type group</span>

            </body>

            </html>

            <?php

            mysql_free_result($Recordset1);

            ?>

            This code generates the buttons in a grid at the correct size for a,320x300 phone.

            Now I have the buttons set up, I need to get them to do something - like submit the form.

            This needs a bit more thought, as usually you only have one button doing the sending.

            I suppose I could place a form round every button, but there must be a better way. All suggestions welcomed.

            Once this problem is overcome, the button clicked on should send its letter to the next page, which would display a list of all types beginning with the chosen letter, and clicking on these then links to a sliding photo display of all the ships in the type group.Easier to use than a drop down list, but the logic and coding from scratch is more difficult.

             

            Howard Walker

            • 3. Re: Creating buttons for a search page
              whatalotofrubbish Community Member

              Quote "

              This needs a bit more thought, as usually you only have one button doing the sending.

              I suppose I could place a form round every button, but there must be a better way. "quote

              Just found the answer in the <button> command in html5

              Replace this:

              echo '<td> <input type="button" name="button" value="' . $b . '" </td> ' ;

               

               

              With this:

              echo '<td><button name = "submit" value="'. $b . '"> ' .$b.' </button> </td> ';

              If you don't use "type = button", all buttons are submit buttons.

              See http://dev.w3.org/html5/markup/button.html#button