2

I'm using Bootstrap WYSIHTML5 html editor in my form like

 <input type="text" name="product" id="product">
 <textarea name="description" id="description" class="textarea" placeholder="Place some text here" style="width: 100%; height: 200px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;">

 </textarea>
 <input type="product_code" name="product_code" id="product_code">

and using Ajax to fetch product details when product is entered in input field and want to update textarea with description

  <script type="text/javascript">
    $(document).ready(function($){
      $('#product').autocomplete({
        source:'<?php echo Router::url(array("controller" => "Products", "action" => "search")); ?>',
        minLength: 1
      });


      $('#product').blur(function() {
        var p_term = $(this).val();

        if (p_term) {
          var dataString = 'term='+ p_term;
          //alert(dataString);

          $.ajax({
              dataType:'json',
              type: "POST",
              url: '/products/ajax-search-product',
              data: dataString,
              cache: false,
              success: function(data) {

                /* set values to input field */
                $('#description').val(data['description']);
                $('#product_code').val(data['product_code']);

              },
              error: function(xhr, ajaxOptions, thrownError) {
                alert(xhr.status);
                alert(thrownError);
              }
          });
        }
      });

    });
</script>

But this code is not updating values of textarea field while $('#product_code').val(data['product_code']); is working fine.

I tried to print value of textarea by alert($('#description').val()); and it is working and printing prefilled value in textarea field.

Edit 2

Console output : console.log(data);

Object { 
  id: 1, 
  product_code: "765457", 
  SKU: "", 
  title: "yuphoria screen guard", 
  description: "yuphoria screen guard", 
  short_description: "yuphoria screen guard", 
  15 more… 
}

I tried with this

$('#description').val(data['description']);    // this not working
alert(data['description']);                    // this working

There is only one id="description" and is nowhere else using.

Gaurav
  • 131
  • 12
  • 1
    It should work. http://stackoverflow.com/questions/8854288/val-vs-text-for-textarea - any errors in console? – mplungjan Aug 22 '16 at 12:25
  • @mplungjan, he is using `val()` so I'm not sure how your link is relevant(?) – Dekel Aug 22 '16 at 12:28
  • It is relevant to not have people answer "Use text()" as one immediately did – mplungjan Aug 22 '16 at 12:29
  • got it :) now with the "it should work" in your comment it is much clearer. – Dekel Aug 22 '16 at 12:30
  • @Gaurav any chance you are doing some other manipulation to the `$('#description')` element somewhere in your code? – Dekel Aug 22 '16 at 12:31
  • This works so there is no data returned in the ajax: `/* set values to input field */ $('#description').val('description'); $('#product_code').val('product_code'); ` - my guess is empty or misspelled data['description'] – mplungjan Aug 22 '16 at 12:31
  • @mplungjan, Its `val(data['description'])` and not `val('description')`. Anyway I tried with both but not working. `alert(data['description']);` works fine and value is printed it means it is not empty though. – Gaurav Aug 22 '16 at 13:05
  • @Dekel not using `('#description')` anywhere else. – Gaurav Aug 22 '16 at 13:07
  • My guess will be the same as @mplungjan suggested - you have some problem with the data returned from the server. Try using hardcoded values (`/* set values to input field */ $('#description').val('description'); $('#product_code').val('product_code'); `) to check where exactly your problem is. – Dekel Aug 22 '16 at 13:08
  • I cannot test with data["description"] since I do not have your server available... What I am saying is that ` ` works so the error is in the data from the server. Console view the ajax – mplungjan Aug 22 '16 at 13:09
  • OR you have another id="description" on the page - you must have unique IDs – mplungjan Aug 22 '16 at 13:10
  • @mplungjan check my `Edit 2` – Gaurav Aug 22 '16 at 13:30
  • Please do `console.log($('#description').length); console.log($('#description'));` – mplungjan Aug 22 '16 at 13:31
  • this outputs `Object { length: 1, context: HTMLDocument → sell, selector: "#description", 1 more… }` – Gaurav Aug 22 '16 at 13:38
  • Pass........................... – mplungjan Aug 22 '16 at 13:47
  • sorry @mplungjan I didn't get you – Gaurav Aug 22 '16 at 13:49

1 Answers1

0

I found this solution, I hope it will help.

$('iframe').contents().find('.wysihtml5-editor').html('your new content here');

yogatofan
  • 1