0

I am requesting a full page using $.get in jQuery and would like to get the content of a specific element. Separately, here is how things look:

$.get( "/page.html").done(function( data ) {
   // get textArea.
});

and I want to get:

document.getElementByTagName("textArea")[0].value;

but I can't do getElementByTagName on data so what is the best way to do this?

user220755
  • 4,358
  • 16
  • 51
  • 68
  • What are you trying to do? Do you only need that value? If so, can't you just make the server return something in JSON? – Matijs Oct 14 '13 at 16:31

5 Answers5

1

I tried using find but that did not work so I ended up using filter and that returned the value of textArea that I needed:

$.get( "/page.html").done(function( data ) {
   var textArea = $(data).filter("textarea")[0].innerText;
});
user220755
  • 4,358
  • 16
  • 51
  • 68
0

You could try jquery load() function.

It will load from remote server and insert document into selected element.

It also allow us to specify a portion of remote document to be inserted.

Assume your remote textarea's id is "remote" and you want to fetch the remote content into a textarea which id is "local"

var result="";
$("#local").load("/page.html #remote", function(response, status, xhr){
  result=$(this).find("#remote").val();
});

I'm not sure if you want to get the remote textarea and insert into the element of the current document.

If you just want to get the value of the remote textarea, you could just hide the load function invoking element

Hope this is helpful for you.

Chickenrice
  • 5,727
  • 2
  • 22
  • 21
0

It's slightly different of what you are doing but i think it can help. You can call .load instead of get and add the whole page to a div say <div id="mydiv"></div>

var value;
$('#mydiv').load('xyz.html',function(){value=$('#mydiv').find('#mytextarea').val()})

however if you do not want mydiv to show you can hide at the beginning once the main page gets loaded and if you also don't want this div on your page you can remove it after the above task is performed.

$(document).ready(function(){
  $('#mydiv').hide();
  var value;
  $('#mydiv').load('xyz.html',function(){value=$('#mydiv').find('#mytextarea').val()});

 $('#mydiv').remove();
})
Udit Bhardwaj
  • 1,761
  • 1
  • 19
  • 29
  • That's going to be a drain on performance and will effect the way you load data because every time you are requesting the data you are loading it into the page, hiding it, processing it, and then removing it which is a longer process than it should be, right? – user220755 Oct 14 '13 at 15:35
  • @user220755 to get the data of a html file like in your question value of textarea from server injecting of that file is required into the DOM structure of the current page and for that purpose `load` is the most suitable option. I am not a pro in web development but i think the cost of performance is very less as compared with completion of task. Please have a look at this link http://stackoverflow.com/questions/3870086/difference-between-ajax-and-get-and-load – Udit Bhardwaj Oct 14 '13 at 16:53
0

//str represents page.html

var str = 'gibberish gibberish <textarea class="test">hello world</textarea>gibberish';

$.each( $.parseHTML(str), function( i, el ) {
    if(el.firstChild) console.log(el.firstChild);
});

Fiddle: http://jsfiddle.net/ez666/7DKDk/

Nick Germi
  • 403
  • 3
  • 6
  • 15
  • This did return the textarea text, however, it also returned few other things. Like the styling of the page for example ... – user220755 Oct 14 '13 at 15:34
0

Since you're using jQuery anyway… have you tried $(data).find('textarea').first().val() yet?

This is assuming that data is a fragment. If it is not you will want to wrap it in a div or something first.

Matijs
  • 3,118
  • 2
  • 29
  • 41