jQuery with css file

Question

Hi Could anyone tell me the best way that I could convert the jquery code below to use a drop down item in a combo box instead of the link shown here. to open the css file 'business.css' and display in a text area thanks rifki

a href="css/business.css" class="link">business style

<script>
$(function(){
   $('.link').click(function(){
     $.get(this.href,null,function(css){
         $('#css').css(css);
         return false;
     });
   });
});
</script>

Answer 1

Instead of this:

$('#css').css(css);

You'd want .text(), like this:

$('#css').text(css);

This assumes that #css is a <pre> element like your previous question had :) Also the data parameter in $.get() is optional, you can just have this:

$.get(this.href, function(css) {

And your return false (or event.preventDefault()) should be in the click handler directly, so all-togehter like this:

$(function(){
  $('.link').click(function(){
    $.get(this.href, function(css){
      $('#css').text(css);
    });
    return false;
  });
});

Answer 2

If this was your html code...

<select id="stylesheetsList">
    <option value="">Please select</option>
    <option value="test.css">test.css</option>
    <option value="anothercssfile.css">anothercssfile.css</option>
</select>
<br />
<textarea id="stylesheetsText">
</textarea>

you could then use this jquery with the event on the dropdown list...

$(document).ready(function() {

    $("#stylesheetsList").change(function() {

        if($(this).val() == "") {
            $("#stylesheetsText").val("");
            return;
        }

        $.get($(this).val(),function(data) {
            $("#stylesheetsText").val(data);
        });

    });

});