Call a function from a html added with html() function - javascript

I have this function into a javascript file :
function toggle_concessions(concessions) {
var text =
"<table>"+
"<tr><td class='concession-name'>gfhgfbfghfd</td><td class='op-encours'>| 15 opérations en cours</td></tr>"+
"<tr class='stats'><td class='concession-adresse'>ghfhdfhdgh</td><td class='voir-concessions'><img id='11' src='img/voirlesoperations.jpg' onclick='toggle_operations('ffff');'></td></tr>"+
"</table>";
;
if($("#"+concessions).attr("class")!="concessions toggled"){
$("#"+concessions).html(text);
$("#"+concessions).toggleClass("toggled");
}else{
$("#"+concessions).toggleClass("");
}
$("#"+concessions).toggle("slow");
}
The function "toggle_operations()" isn't working when I click on the image. Even when I execute an alert it doesn't work.
What can I do ?
Thanks

your html-embedded js is not well formed due to wrong pairing of string delimiters - you have to escape the quotes surrounding the argument to you toggle_operations call:
"<tr class='stats'><td class='concession-adresse'>ghfhdfhdgh</td><td class='voir-concessions'><img id='11' src='img/voirlesoperations.jpg' onclick='toggle_operations(\'ffff\');'></td></tr>"+

Related

Call a javascript function from anchor tag inside td inside javascript code

Only Basic javascript knowledge is required.If anyone knows please help me.
I don't know how to do it but i have tried it in many ways but still not able to pass the value.
Simply, i have a for loop and i have a td inside it. I want to call a javascript function from this td click but problem is i am unable to pass any parameter to this function.
the code is here :
function GetContractList(abc) {
var data = abc
for (var it in data) {
tab += "<tr>";
tab += "<td>" + data[it].ContractCode + "</td>";
if (data[it].ContractCode != "") {
var Contract = data[it].ContractCode;
tab += "<td><a onclick='Delete_User(Contract);'>View</td>";
// tab += "<td><a data=" + data[it].ContractCode + " href='javascript:Delete_User(this.data);'>View</td>";
}
else {
tab += "<td></td>";
}
As u can see, i have tried to pass parameter to Delete_User function but the syntax is somewhere broken.
tab += "<td><a onclick='Delete_User(Contract);'>View</td>";
this line gives error-- Contract is not defined.
"<td><a data=" + data[it].ContractCode + " href='javascript:Delete_User(this.data);'>View</td>".
This line also doesnot passes any value to the function.
Please someone help me out.
try:
var cont = data[it].ContractCode.replace(/"/g, '\\"');
tab += '<td><a onclick="Delete_User(\''+cont+'\');">View</td>";
first line encodes any double quotes
the second line inserts the contract as a parameter and adds single quotes around it
You need to escape the quote for the parameter of the function.
tab += '<td>View</td>';
// ^^ ^^
function Delete_User(id) {
console.log('Delete_User', id);
}
var cc = '4711abc',
tab = 'View';
document.write(tab);

php string formating in javascript function

Please help me to solve this string formating . it shows error while running.
I need to call a java script function AddHotel() with some php variables from an input tag. while running the first parameter in function shows error. It should be like onClick='AddHotel('divid', 'some_id', 'id',ids,rate)'
but while running in comes as onClick='AddHotel(divid', 'some_id', 'id',ids,rate)'
$resort[] = "<div id='".$iiiddd."'><input id='hotel_day".$child_post->ID.$dyid."' name='hotel_day".$dyid."' type='radio' value='".$child_post->ID."' onclick='AddHotel(".$p.",'".$s."','".$psid."','".$dyid."','".$child_post->ID."',".$child_post->fields['price'].")' />
<input id='".$s."' name='expsel".$dyid."[]' type='hidden' value='' />".$child_post->post_title."<span>Rs:- ".$child_post->fields['price']."</span></div>";
You want to escape Quotes
$resort[] = "<div id='".$iiiddd."'><input id='hotel_day".$child_post->ID.$dyid."' name='hotel_day".$dyid."' type='radio' value='".$child_post->ID."' onclick='AddHotel(".$p.",\'".$s."\',\'".$psid."\',\'".$dyid."\',\'".$child_post->ID."\',".$child_post->fields['price'].")' />".$child_post->post_title."Rs:- ".$child_post->fields['price']."";
For all who face such issues:
You should always use Double quotes for HTML attributes value eg:
<div attribute="value"><div>
For passing variables in a Javascript functions, you must use quotes (single quote preferably) for string. eg:
somethingAwesome('work', 'life', 1);
While embedding HTML and Javascript in PHP, you must not get confused with Quotes.
PHP string + HTML element:
$string = '<div></div>';
PHP string + HTML element with attributes:
$string = '<div id="awesome"></div>';
PHP string + HTML element with attributes + Javascript Function:
$string = '<div id="awesome" onclick="somethingAwesome()"></div>';
PHP string + HTML element with attributes + Javascript Function with Parameters:
$string = '<div id="awesome" onclick="somethingAwesome(\''.$string.'\', \''.$string2.'\', '.$integer.');"></div>';
You are open to choose double or single quotes, but following one particular fashion will prevent you from getting confused.
Also remember to Indent your code even in case of HTML in strings
Solution for your issue:
$resort[] = '<div id="'.$iiiddd.'">
<input id="hotel_day'.$child_post->ID.$dyid.'" name="hotel_day'.$dyid.'" type="radio" value="'.$child_post->ID.'" onclick="AddHotel(\''.$p.'\', \''.$s.'\', '.$psid.', \''.$dyid.'\', '.$child_post->ID.', \''.$child_post->fields['price'].'\')" />
<input id="'.$s.'" name="expsel'.$dyid.'[]" type="hidden" value="" />
'.$child_post->post_title.'
<span>Rs:- '.$child_post->fields['price'].'</span>
</div>';

Function not called via javascript in href

I used a code that I found in the web and then changed a little thing:
<script type="text/javascript">
var foodList = [];
function addToFood (addFood) {
alert(addFood);
//foodList.push(addFood);
//for (i = 0; i < foodList.length; i++) {
// var newFood = "<a href='#' onClick='removeRecord(" + i + ");'>X</a> " + foodList[i] + " <br>";
//};
//document.getElementById('foods').innerHTML += newFood;
}
</script>
At this moment I only want to alert the parameter on addToFood. The function should be called:
echo "<a href='javascript:addToFood(". $zeile1['TITLE'] .");' class='band-head'>Add</a>";
this line shows how I add an <a> with the javascript in the href. The php render the right line but the addToFood is never called.
Have a look at the online Demo: http://anthraxx.sytes.net/ maybe it can help you more then me.
The error I get via Google Chrome: Uncaught SyntaxError: Unexpected identifier But just can't figure that unexpected identifier out.
Thanks
You need to wrap the $zeile1['TITLE'] inside a string, as such:
echo "<a href='javascript:addToFood(\"". $zeile1['TITLE'] ."\");' class='band-head'>Add</a>";
You can see that I added escaped quotes \" after the opening parenthesis, and before the ending one, in the JS-call.
Otherwise it will try to pass an variable to the function, instead of a string.
Why escaped? That is because you are echo:ing it with PHP. If I didn't escape the quote, the PHP would interpret it as I was ending the string, which is not what we want. I want to put the quotes in there as inline-code.
Just scope your vaiable between ' ' or " " ,When you don't scope String's ,javascript read it like Var.
You need to escape the $zeile1['TITLE'], thats true and you can do that by using following line -
echo "<a href='javascript:addToFood(\"". $zeile1['TITLE'] ."\");' class='band-head'>Add</a>";
This is working.
try this
echo 'Add';
Replace :
echo "<a href='javascript:addToFood(". $zeile1['TITLE'] .");' class='band-head'>Add</a>";
With:
echo "<a href='javascript:addToFood(\"". $zeile1['TITLE'] ."\");' class='band-head'>Add</a>";

Calling a function from another function with arguments

I am a beginner to javascript ! I am trying to call a function from another function inside the same script tags. When I do this without sending arguments it works fine but when i do that with arguments that another function is not called..
Here is what I am doing
function measurement_convert()
{
var mc = "Measurement Conversion";
txt = "<h2>" + mc + "</h2> <br><br>";
txt +=
"<form action='' method='post'>" +
"Select Type <select name='conversion_type' onchange='loadXML('abcd')'> "+
"<option value='area'>Area</option>"+
"<option value='length'>Length</option>"+
"<option value='volume'>Volume</option>"+
"<option value='weight'>Weight</option>"+
"</select> <br><br>"
document.getElementById("content_main_top").innerHTML=txt;
}
So, I am calling the function from onchange of this form.
And here's the another function
function loadXML(var1)
{
document.getElementById("content_main_top").innerHTML=null;
document.getElementById("content_main_bottom").innerHTML=null;
}
Can anyone help me ?
Your problem is that you are trying to nest the same type of quote:
onchange='loadXML('abcd')'
This actually gets interpreted as:
onchange='loadXML('
Instead, try (note the escaped double-quotes, since this code is inside a PHP string):
Select Type <select name=\"conversion_type\" onchange=\"loadXML('abcd')\">
Your single quotes are clashing in the onchange value, as you use the same for closing the value in.
You can change it to:
"Select Type <select name='conversion_type' onchange=\"loadXML('abcd')\"> "

Copy div to a popup

How can I copy an entire div to a popup window?
What I`m trying to do:
function ImprimirTela() {
var text = "<html>\n<head>\n<title>Impressão Guia</title>\n";
text += "<script src='~/js/jquery-1.4.2.js' type='text/javascript' language='javascript' />\n";
text += "</head>\n<body>\n";
text += "<input type='button' value='Imprimir esta página' onclick='window.print();' style='float: right' />\n";
text += "<div id='conteudo'>\n";
text += $("#divDadosBasicos").html($(querySelector).html());
text += $("#divHipotesesDiagnosticas").html($(querySelector).html());
text += "</div>\n/body>\n</html>";
var newWindow = window.open('', 'Impressao', 'width=900,height=700');
newWindow.document.write(text);
}
I dont know if this is the better way to do it. If you think/know a easier way to do it, please share
Thanks in advance!
Fix some of these errors and it will work fine
Script tag is not closed properly
body tag not closed properly
querySelector is not defined. (I am commenting that portion)
function ImprimirTela() {
var text = "<html>\n<head>\n<title>Impressão Guia</title>\n";
text += "<script src='~/js/jquery-1.4.2.js' type='text/javascript' language='javascript'></script>\n";
text += "</head>\n<body>\n";
text += "<input type='button' value='Imprimir esta página' onclick='window.print();' style='float: right' />\n";
text += "<div id='conteudo'>\n";
//define querySelector
//text += $("#divDadosBasicos").html($(querySelector).html());
//text += $("#divHipotesesDiagnosticas").html($(querySelector).html());
text += "</div>\n</body>\n</html>";
var newWindow = window.open('', 'Impressao', 'width=900,height=700');
newWindow.document.write(text);
}
You could use a Jquery Modal Popup
http://jqueryui.com/demos/dialog/
Check it out, it has the functionality that you need.
It has several events you can tweak to modify the data.
Just tested this, and the code seems to be working just fine as long as querySelector is defined, and it's in a document.ready function and you are testing this on an actual webserver (like WAMP/LAMP etc.). It will not work in places like jsFiddle etc.

Categories