Solved

populate textarea and file input from a dropdown -- Ajax and jQuery

Posted on 2010-08-26
7
1,052 Views
Last Modified: 2012-05-10
I need to query a mysql db for two fields: content_value and image_path, depending on the col_name  selected from a dropdown; then I need to populate a textarea and file input with the retrieved values.

Can anyone explain how to manage this using jQuery?
0
Comment
Question by:Glen Gibb
  • 4
  • 3
7 Comments
 
LVL 10

Expert Comment

by:mstrelan
ID: 33539166
It is not possible to populate a file input via javascript. This is a well documented security precaution.
0
 

Author Comment

by:Glen Gibb
ID: 33539187
How about the textarea then?
0
 
LVL 10

Expert Comment

by:mstrelan
ID: 33539212
Something like this ...
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
<textarea id="myTextArea"></textarea>
<select id="myDropDown">
<option value="option_1">Option 1</option>
<option value="option_2">Option 2</option>
</select>
<script>
var myArray = {
  option_1: 'the content value goes here',
  option_2: 'some more content value goes here'
}

$(document).ready(function(){
  $('#myDropDown').change(function(){
    var selection_option = $(this).val();
    $('#myTextArea').val(myArray[selection_option]);
  });
});
</script>

Open in new window

0
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 

Author Comment

by:Glen Gibb
ID: 33539264
That's more what I needed.  My dropdown has the names of the different rows I'm searching for (col_name).  

The SQL needs to be something like:  "SELECT content_value FROM page_content WHERE col_name = (dropdown selected value)".

Where does the db query go in the whole process, and how do I get the data back in the textarea?
0
 
LVL 10

Accepted Solution

by:
mstrelan earned 500 total points
ID: 33539274
you can use php (or another backend language) to build up the myArray variable before the page load. this can become problematic if there are large amounts of text you need to store. alternatively you need to perform an ajax request. to learn about ajax requests follow this tutorial - http://www.talkphp.com/vbarticles.php?do=article&articleid=58&title=simple-ajax-with-jquery
0
 

Author Comment

by:Glen Gibb
ID: 33543861
I appreciate the model.  However, the example shows how to POST.

How do I retrieve data from the php file:  return $row? echo $row?

Sorry to be so dense but I just don't see the big picture yet.
0
 

Author Closing Comment

by:Glen Gibb
ID: 33544808
The link had the necessary info, along with your example.  Thanks.

(By the way, the result needs to be echoed on the php page.)
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Introduction Got endorsements from your clients?  Great!  There is almost nothing better than word-of-mouth advertising.  But how can you do that on the internet?  Sure you can make a page for endorsement quotations and list them all, but who is …
Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

809 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question