SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Nov 2011
    0 Post(s)
    0 Thread(s)

    Reload Dropdown list without refresing page

    How can I execute this:

    From the dropdown list build up from mysql database (say a list of fruits).

    I select "Add New Fruit". This triggers it to either have a modal form to add new fruit or a table form.

    Once submitted, Select dropdown list RELOADS including the newly added data (fruit) without reloading the whole page which contains other form control such as textbox.

  2. #2
    SitePoint Zealot infoxicated's Avatar
    Join Date
    Jun 2001
    0 Post(s)
    0 Thread(s)
    You'll have to do it with an AJAX call and insert the response into the page.

    I do this kind of thing with jQuery quite often and it works a treat.

  3. #3
    SitePoint Addict sdleihssirhc's Avatar
    Join Date
    Feb 2009
    1 Post(s)
    0 Thread(s)
    There are going to be two parts to this: the JavaScript on the client and the [insert language of your choice] on the server.

    On the Client

    As infoxicated said, jQuery is way, way simpler than trying to do this yourself. In particular, it has a load function that makes an AJAX request, assumes that the returned data is HTML, and inserts the HTML into whatever element you choose:

    Code JavaScript:
    $(yourSelect).load('somepage.php'); // so easy!

    On the Server

    The only argument you'll (probably) need to pass to the load function is the URL of a page that will spit out an HTML fragment. I used PHP in that example, but only because that's the only language I know. It can be any type you want.

    Whatever language you choose, it needs to do the following:

    1. Get the current list from the database.
    2. Turn that list into an HTML string.
    3. Echo or print the string.
    I'm the web overlord for Graphic Business Systems


Posting Permissions

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