Select element from Jquery post return - javascript

I am trying to select an element from jquery post returning data. String is returning but when I try to select an element from returning html string, selection is always null. This is a userscript which is being loaded with greasemonkey.
refresh();
function refresh(___id,___action,___page){
$.post("http://www.example.com", {auction_id:___id,action:___action,page:___page}, function(bidpage){
var auction_id = $("#auction_id", bidpage).val();
console.log(auction_id);
});
This post returns this data
<html><head></head><body><input type="hidden" name="auction_id" id="auction_id" value="8583949"></body></html>
But auction_id is always null. Cant find any solution to that. Thank you for your helps.

This is because you get bidpage as string. You need to convert it to HTML first:
var auction_id = $("#auction_id", $( bidpage ) ).val();
As by jQuery API [context] should be DOM Element, Document, or jQuery.
COMMENT:
Seems like jQuery strips <html> and <body> elements so you need to use:
var auction_id = $( bidpage ).val();

you could try adding your post data to a div:
<div id="appendpostdatahere"></div>
function refresh(___id,___action,___page){
$.post("http://www.example.com", {auction_id:___id,action:___action,page:___page},
function(bidpage){
$('#appendpostdatahere').html(bidpage);
var auction_id = $('#auction_id).val();
console.log(auction_id);
});
}

Related

How to get specific string value from long String in Java Script? I want to get amount between <tax_amt> tag?

I have this code:
<Detail2 domID='1'>
<tax_amt>1</tax_amt>
<Taxes status="N"><Tax domID="1"><attribute pkNames="" selected="N" status="N" updateFlag="A"/><tran_code>BILS</tran_code><tran_id>#dbID</tran_id><line_no> 1</line_no><line_no__tax> 1</line_no__tax><tax_code>SRVC</tax_code><tax_class>1SAL</tax_class><tax_chap>8040</tax_chap><tax_base>AMT</tax_base><tax_env>SRVC08091</tax_env><tax_descr>SERVICE TAX</tax_descr><taxable_amt>36.0</taxable_amt><tax_perc protect="1">4.0</tax_perc><tax_amt>1</tax_amt><chg_stat>N</chg_stat><tax_set>SRVC890001</tax_set><effect>+</effect><acct_code__reco>3022 </acct_code__reco><cctr_code__reco>H101</cctr_code__reco><reco_perc>100.0</reco_perc><reco_amount>1.0</reco_amount><acct_code>3022 </acct_code><cctr_code>H101</cctr_code><rate_type>P</rate_type><round>R</round><round_to>1.0</round_to><tax_form/><tax_form_date/><posted>N</posted><pay_tax>N</pay_tax><cc_editopt>N</cc_editopt><series_edit/><curr_code__tax/><curr_code__tran/><tax_amt__tcurr>1</tax_amt__tcurr><exch_rate>1.0</exch_rate><exch_rate_tran>1.0</exch_rate_tran></Tax></Taxes>
</Detail2>
<Detail2 domID='1' ><tax_amt>1</tax_amt></Detail2></Root>
Can you use jquery? If yes, then
$( "Detail2" ).find( "tax_amt" ).text();
or only javascript then
var doc = new DOMParser().parseFromString(xmlString,'text/xml');
var result = doc.evaluate('/Detail2/tax_amt', doc, null, XPathResult.STRING_TYPE, null);
alert(result)

How to get the value of an html attribute

I have the following jquery code :
$j = jQuery.noConflict();
function displaySelected(elem){
var value = $j(elem).find(".columnToHide").html();
console.log(value);
}
The out put of this is : <div class="hiddenId" data="a05o000000V88VFAAZ"></div>.
However, I would like to only get the value in the data tag i.e. the id. I know you can do something like this..
.html("<div class='hiddenId' data='a05o000000V88VAAAZ'></div>")
but this doesn't strip the tags. Any help please
Use jquery's .attr() method. So: $j(elem).find(".columnToHide").attr("data")
Use jQuery's data method to retrieve the value. (Your data attribute should probably take the form of data-name if you have control over that.)
This line will drill down to the content you want:
$(value).attr('data')
To put in context of the rest of your script:
$j = jQuery.noConflict();
function displaySelected(elem){
var value = $j(elem).find(".columnToHide").html();
console.log($(value).attr('data')); // a05o000000V88VAAAZ
}
$j = jQuery.noConflict();
function displaySelected(elem) {
var value = $j(elem).find(".columnToHide").attr("data");
console.log(value);
}

How to set what user types in textarea as a javascript variable?

Hi so I have a HTML textarea. I want what the user types in it to be displayed on the screen and also stored in a variable. I have the displaying part but I can't figure out how to store it as a a variable.
The html
<textarea id="input" maxlength="50" name="Text" placeholder="Max. 50 characters"></textarea>
The javascript
$('#input').keyup(function() {
$('#text').html($(this).val());
var yourText = this.val();
});
Firstly, you should use change or input instead of keyup. Not everyone uses a keyboard!
Second, only jQuery objects have a val() method. Using this you are referring to the <textarea> element which does not:
$('#input').on("input", function() {
var yourText = $(this).val(); // Only jQuery objects have a .val()
$('#text').html(yourText); // Pass your variable in here
});
jsFiddle Demo
$('#input').keyup(function() {
$('#text').html($(this).val());
var yourText = this.val();
});
Should be
$('#input').keyup(function() {
$('#input').html($(this).val());
var yourText = $(this).val();
});
You gave #text as an id, but the id name of the input is #input
You forget the javascript closure $ on this. Use the code below
<textarea id="input" maxlength="50" name="Text" placeholder="Max. 50 characters"></textarea>
<div id="text1"></div>
<script>
$('#input').keyup(function() {
$('#text').html($(this).val());
var yourText = $(this).val();
$("#text1").html(yourText);
});
</script>
JSFIDDLE:http://jsfiddle.net/7tfs93o2/
Hope this helps you
You are doing var yourText = this.val(); but since you are using JQuery there, .val() is a JQuery method, this should also be wrapped with the JQuery layer like this:
var yourText = $(this).val();

Javascript handle 2 data attribute

I need to use data attribute in my html
like
<div id="userlist" data-user="A.A.M"></div>
then I need to alert the data-user
I used
var userlist = document.getElementById("userlist");
var show = userlist.getAttribute("data-user");
alert(show);
My question is how to handle many data-user in the html like
<div id="userlist" data-user="A.A.M"></div>
<div id="userlist2" data-user="A.A.M2"></div>
to alert A.A.M and A.A.M2
Thanks in advance and sorry for my bad English.
You could select your elements by attribute.
$("div[data-user]").each(function() {
var user = $(this).data("user");
alert(user);
});
If you have multiple attributes per element (<div data-user='something' data-another='another'></div>), you can also access those in the same way:
$("div[data-user]").each(function() {
var user = $(this).data("user");
var another = $(this).data("another");
alert(user + ", another: " + another);
});
you know how to alert 1, alert 2:
alert at the same time:
var data1 = document.getElementById("userlist").getAttribute("data-user");
var data2 = document.getElementById("userlist2").getAttribute("data-user");
var data = data1 +"\n" + data2; //"\n" can be other separators you like
alert(data)
if you have many of them, you can use jQuery:
add this in your , before any other js code.
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
then :
$("div[id^=userlist]").each(function(){
alert($(this).attr("data-user"));
});
Calling getElementById on both should work. If you want to iterate you can try to use getElementsByTagName or getElementsByClassName. If you want to select any arbitrary element with the attribute data-user, you can either use querySelectorAll, or check out jQuery, and use $("[data-user]") as a selector.
Does that answer your question?

How to put alert value to element

in this code i am trying to get the alert value to the element.
brief:
my ajax code checks the database values and gets the new values from database and
displays the fetched values in alert. but i am not able to put that alert values into
element...
How can i do this?
Code:
<script>
$(document).ready(function(){
$("#refresh").click(function(){
var fileId=id;
var rowNum = $(this).parent().parent().index();;
$.ajax({
type:"post",
url:"checkStatusAndNumRecs",
data:{fileId:fileId},
success:function(data)
{
setTimeout(alert(data), 2000);
var allTds = $("#rtable tr:eq('"+rowNum+"')").find('td');
$(allTds)[4].html(data[0]);
$(allTds)[3].html(data[1]);
document.getElementById("#div1").innerHTML=data;
},
error:function(data)
{
document.getElementById("#div1").innerHTML="It was a failure !!!";
}
});
});
});
</script>
HTML code:
<td><div id="div1"><s:property value="%{#m.status}" /></div></td>
In alert(data) i am getting the value.
but when i put same value like this
document.getElementById("#div1").innerHTML=data;
it is not applying the value to element
you don't need # using javascript's getElementById
try this
document.getElementById("div1").innerHTML=data; //notice no `#` in front of div1
or
using jquery that should be
$('#div1').html(data);
try
document.getElementById("div1").innerHTML=data[0];
document.getElementById("div2").innerHTML=data[1];
or
$('#div1').html(data[0]);
$('#div2').html(data[1]);
Pass the actual data inside the object to the HTML element, not the object itself.

Categories

Resources