I'm working with an if else statement which will only display depending on the statement. My confirm window is not working. It will just go to the log-out page without the confirmation.
My code:
else
{
echo "
<td class='td1' align='center'>
<a href='logout.php' onclick='return confirm('Are you sure you want to Log Out?')'><img src='./buttons/logout1.png' width='50' height='35' alt='Log Out'></a>
</td>
</tr>
</table>
";}
<table><tr>
<td class='td1' align='center'>
Log Out
</td>
</tr>
</table>
Change your code to this
else
{
echo "
<td class='td1' align='center'>
<img src='./buttons/logout1.png' width='50' height='35' alt='Log Out'>
</td>
</tr>
</table>
";}
Use escape sequence inside onlclick.
Just simply replace your code with this because you have placed a return before confirm, but by JavaScript there is the confirm keyword which will give you functionality what you are expecting instead of return confirm. Just confirm will work.
else
{
echo "
<td class='td1' align='center'>
<a href='logout.php' onclick='confirm('Are you sure you want to Log Out?')'><img src='./buttons/logout1.png' width='50' height='35' alt='Log Out'></a>
</td>
</tr>
</table>
";}
You either use
<img ...>
Note the return (confirm): The value returned by scripts in intrinsic events decides whether the default browser action is run or not; in case you need to run a big piece of code you can of course call another function:
<script type="text/javascript">
function confirm_delete() {
return confirm('Are you sure?');
}
</script>
...
<img ...>
Or else you can simply try this:
onclick="javascript:return confirm('Are you sure you want to logout?')"
Use double "" instead of ''. Then it's OK. Change to onclick="confirm('Are you sure you want to Log Out?')"
<img src='./buttons/logout1.png' width='50' height='35' alt='Log Out'>
Be careful with your single quotes. Replace ยด by " in confirm:
Here is an example: jsfiddle.net/37z6wpmz/
Related
When I click cancel on the pop up message it still deletes the record and I don't know why.
<tr>
<td class="recordCells">
<div align="center">
<a onclick="confirm('Are you sure you want to delete this record?')" href="deleterecord.php?ID=<?php echo $row_rsInventory['ID']; ?>">
<img src="../images/x.png" align="absmiddle">
</a>
</div>
</td>
</tr>
You doesn't return the value of the confirm box :
<tr>
<td class="recordCells">
<div align="center">
<a onclick="return(confirm('Are you sure you want to delete this record?'))" href="deleterecord.php?ID=<?php echo $row_rsInventory['ID']; ?>">
<img src="../images/x.png" align="absmiddle">
</a>
</div>
</td>
</tr>
Actually there is a problem of "href = deleterecord.php file" in anchor tag so you can use code something like that:
jQuery(".confirm_click").click(function(){
var check = confirm("Are you sure you want to delete this record?");
if(check == true){
// Action - Record deleted
var url= jQuery(this).attr("url");
jQuery(location).attr('href',url);
}else{
// Action - none
}
});
Html code:-
<a class="confirm_click" href="" url="deleterecord.php?ID=<?php echo $row_rsInventory['ID']; ?>">
<img src="../images/x.png" align="absmiddle">
</a>
or you can send me a part of code on "mohit.tiwari#techinfini.com" and i'll make it in proper way.
http://jsfiddle.net/yjxq7bae/1/
I am trying to select the checkbox prop in the input tag. The id and name of the input tag are reused, so I have to use the <nobr> text to scale the dom and get the value.
<tr>
<td nowrap="true" valign="top" width="190px" class="ms-formlabel">
<h3 class="ms-standardheader">
<nobr>Confirmation Sent</nobr>
</h3>
</td>
<td valign="top" class="ms-formbody">
<span dir="none">
<input id="ctl00_m_g_ed53ee23_de9d_4105_ba24_00e2a21cef5e_ctl00_ctl05_ctl50_ctl00_ctl00_ctl04_ctl00_ctl00_BooleanField" type="checkbox" name="ctl00$m$g_ed53ee23_de9d_4105_ba24_00e2a21cef5e$ctl00$ctl05$ctl50$ctl00$ctl00$ctl04$ctl00$ctl00$BooleanField" checked="checked" /><br />
</span>
</td>
</tr>
<div>Click Here</div>
I have tried every conceivable way. If you will notice .closest() fails once I go up one more from the <h3> element. The fiddle demonstrates this on load by first changing the css of h3, and then attempting to hide the td.
var mop = $('nobr').filter(function () {
return $(this).text() === 'Confirmation Sent'
}).closest("tr").find("input[type=checkbox]").prop('checked');
alert(typeof mop);
$('nobr:contains(Confirmation Sent)').closest("h3").css("background", "yellow");
$('nobr:contains(Confirmation Sent)').closest("h3").closest("td").hide();
$('div').on("click ", function (event) {
var toast = $('nobr').filter(function () {
return $(this).text() === 'Confirmation Sent'
}).closest("tr").find("input[type='checkbox']").prop('checked');
alert(typeof toast);
});
The problem is that you don't have correct syntax for a table. You're missing the <table> and </table> tags around your rows.
Since it's not a valid table, the browser throws away your <tr> and <td> tags:
If you wrap your HTML in a <table> your javascript works as intended.
I wanted to display some integer values in the html from javascript but unfortunately both .html and .text is not working
here is my code
<script type="text/javascript">
$(".total").text("<?php echo $row_price['product_price'] + $economy; ?>");
$('input:radio[name="shipping_type"]').change(function(){
if($(this).val() == "economy"){
$(".total").text("<?php echo $row_price['product_price'] + $economy; ?>");
}else{
$(".total").text("<?php echo $row_price['product_price'] + $fast; ?>")
}
});
</script>
By checking the source code value is successfully coming in the .text() function. no error is displaying on the console as well
html
<tr>
<td class='radio-container'>
<input checked="checked" id="shipping_type_economy" name="shipping_type" type="radio" value="economy" />
</td>
<td><label for="shipping_type_domestic">Economy</label></td>
<td class='right'>
<span class="economy">10.20$</span>
</td>
</tr>
<tr>
<td class='radio-container'>
<input id="shipping_type_fast" name="shipping_type" type="radio" value="fast" />
</td>
<td><label for="shipping_type__fast">Fast</label></td>
<td class='right'>
<span class="fast">20.00$</span>
</td>
</tr>
<tr><td>TOTAL</td>
<td class="right" id="total"><span class="total"><span/></td>
</tr>
Your code is correct,just wrap your Jquery Code inside $(document).ready(function(){..}) block as shown below :-
$(document).ready(function(){
//Jquery Code
});
You are using the jQuery syntax, which requires you to have the jQuery library included. jQuery is a library on top of javascript. http://jquery.com/, besides that, the code needs to be wrapped in a doc ready statement.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
....your code
});
</script>
I am trying to get my button selections to display in a table on my web application. Bellow you find the pieces of code that relate to my 1. My function which allows for the selections (may not even be relevant..), 2. the buttons which you can select in order to set the parameters, and 3 the table with class name and the rows where they will go. I've been struggling with this! Please Help!
My function:
function setClip(val)
{
clip=val;
}
function setZoom(val)
{
zoom=val;
}
function geoMap(val)
{
gmap=val;
}
function swap(imgNumber)
{
if(clip==true & zoom==false & gmap==false)
document.getElementById("default").src=imgNumber+"clip.jpg";
else if(clip==false & zoom==true & gmap==false)
document.getElementById("default").src=imgNumber+"zoom.jpg";
else if(clip==false & zoom==true & gmap==true)
document.getElementById("default").src=imgNumber+"zoomp.jpg";
else if(clip==true & zoom==true & gmap==true)
document.getElementById("default").src=imgNumber+"clipzoomp.jpg";
else if(clip==true & zoom==false & gmap==true)
document.getElementById("default").src=imgNumber+"clipp.jpg";
else if(clip==true & zoom==true & gmap==false)
document.getElementById("default").src=imgNumber+"clipzoom.jpg";
else if(clip==false & zoom==false & gmap==true)
document.getElementById("default").src=imgNumber+"p.jpg";
else
document.getElementById("default").src=imgNumber+".jpg";
}
My Buttons:
<input type ="button" id="button3" value="Apply Mask" onclick="setClip(true)">
<input type ="button" id="button3" value="No Mask" onclick="setClip(false)">
<input type="button" id="button3" value="Maintain Zoom In" onClick="setZoom(true)">
<input type="button" id="button3"value="Maintain Full View" onClick="setZoom(false)">
<input type="button" id="button3" value="GeoMap On" onClick="geoMap(true)">
<input type="button" id="button3" value="GeoMap Off" onClick="geoMap(false)">
The table I would like my selections to be displayed in, basically I want the values of the selected buttons to but put in the table after they have been selected
<table class="status" height="50" width="800">
<tr>
<td width="200" align="center">Step 1 Selection</td>
<td width="200" align="center">Step 2 Selection</td>
<td width="200" align="center">Step 3 Selection</td>
</tr>
</table>
I think your best bet here is using jQuery. It's far easier to manipulate than Javascript and was designed to easily manipulate objects. If you know CSS and a little Javascript, it's easy to pick up too. You don't even have to host it, as Google hosts it. All you need to do is add the following source code to the top where your scripts are:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
var buttonCount=1;
$(document).ready(function() {
$("input[type='button']").click(function() {
if(buttonCount <= 3) {
//make sure that there are no duplicates
if($(this).get(0).className != "buttonUsed")
{
$(this).get(0).className = "buttonUsed";
var htmlString = $(this).attr('value');
$('#sel' + buttonCount).html(htmlString);
buttonCount++;
}
}
});
});
... The rest of your script
I notice that you have been using IDs like one might use classes. I would advise you to consider using the class attribute for things like "button" and make IDs more unique. It will make it easier to code with Javascript, as JS usually follows IDs and works best if it targets only one element per ID. In any case I did rename your IDs. If you have CSS you can rename your CSS classes. Just note that in my code I renamed a class so that you can't choose more than one. That might work for you anyway, because then your button that has been used can look different from the unused buttons.
Anyway, here is the HTML, adapted:
<table class="status" id="buttonStatus" height="50" width="800">
<tr>
<td width="200" align="center">Step 1 Selection</td>
<td width="200" align="center">Step 2 Selection</td>
<td width="200" align="center">Step 3 Selection</td>
</tr><tr>
<td width="200" align="center" id="sel1"> </td>
<td width="200" align="center" id="sel2"> </td>
<td width="200" align="center" id="sel3"> </td>
</tr>
</table>
</body>
Let me know if this works.
Update
To edit as you desire, use this:
$(document).ready(function() {
$("input[type='button']").click(function() {
//make sure that there are no duplicates
var buttonClassName = $(this).get(0).className;
if(buttonClassName != "buttonUsed")
{
var buttonID = $(this).attr('id');
var firstPart = buttonID.substring(0,6);
var secondPart = buttonID.substring(6,7);
var thirdPart = buttonID.substring(7);
var newThirdPart;
switch(thirdPart)
{
case "a" : newThirdPart = "b"; break;
case "b" : newThirdPart = "a"; break;
}
$(this).get(0).className = "buttonUsed";
$("#" + firstPart + secondPart + newThirdPart).get(0).className = "button";
var htmlString = $(this).attr('value');
$('#sel' + secondPart).html(htmlString);
}
});
});
And the HTML
<body>
<input type ="button" class="button" id="button1a" value="Apply Mask" onclick="setClip(true)">
<input type ="button" class="button" id="button1b" value="No Mask" onclick="setClip(false)">
<input type="button" class="button" id="button2a" value="Maintain Zoom In" onClick="setZoom(true)">
<input type="button" class="button" id="button2b"value="Maintain Full View" onClick="setZoom(false)">
<input type="button" class="button" id="button3a" value="GeoMap On" onClick="geoMap(true)">
<input type="button" class="button" id="button3b" value="GeoMap Off" onClick="geoMap(false)"><BR><BR><BR>
<table class="status" id="buttonStatus" height="50" width="800">
<tr>
<td width="200" align="center">Step 1 Selection</td>
<td width="200" align="center">Step 2 Selection</td>
<td width="200" align="center">Step 3 Selection</td>
</tr><tr>
<td width="200" align="center" id="sel1"> </td>
<td width="200" align="center" id="sel2"> </td>
<td width="200" align="center" id="sel3"> </td>
</tr>
</table>
</body>
Note on CSS
This JQuery changes the classname of the active button to buttonUsed, which means you can create a CSS to make the button look highlighted. If you'd rather not do that, and would rather have everything stay as button, you don't actually need it in the new example (whereas in my initial stab at it, it was very necessary).
$(document).ready(function() {
$("input[type='button']").click(function() {
//make sure that there are no duplicates
var buttonID = $(this).attr('id');
var secondPart = buttonID.substring(6,7);
var htmlString = $(this).attr('value');
$('#sel' + secondPart).html(htmlString);
});
});
Much simpler, in fact. At least I showed you the sort of things jQuery is capable of. Whether you choose to use it or not is up to you. Happy coding!
I am using a a href "Click Here" link in the page and if we click it will open a pop up contact form using javascript, here i need to get the value say like "id" into that popup from the a href so that i can manipulate the contact form,
Click Here
javascript function:
function showDiv(DisplayDiv) {
if (document.getElementById) { // DOM3 = IE5, NS6
if(document.getElementById("simpleMap"))
{
document.getElementById("simpleMap").style.visibility = 'hidden';
}
document.getElementById(DisplayDiv).style.visibility = 'visible';
}
else {
if (document.layers) { // Netscape 4
document.DisplayDiv.visibility = 'visible';
}
else { // IE 4
document.all.DisplayDiv.style.visibility = 'visible';
}
}
}
Popup Screen:
<div id="Showcase_10" style="visibility:hidden;">
<div id="fade"></div>
<div class="popup_block">
<div class="popup">
<form action='result.php' onSubmit="return valid()" method="post">
<input type="hidden" name="siteid" value="<? echo $_REQUEST['siteid']; ?>"> <table width="90%" bgcolor="#eff8ff" border="0" style="border:solid; border-width:1px; border-color:#ccc" align="center" cellpadding="2" cellspacing="3" class="small-content">
<tr><td width="6%"> </td>
<td colspan="2" align="left" class="subhead">Email Property Details</td>
</tr><tr><td width="6%"> </td><td class="cont">Request more information, make an appointment or ask a question. </td>
</tr>
<tr>
<td width="6%"> </td>
<td width="94%"><strong>Name</strong><br/>
<input name="name" type="text" class="field1" value=""/> <font color="#FF0000"><strong>*</strong></font></td></tr>
<tr>
<td width="6%"> </td>
<td width="94%"><strong>Your Email</strong><br />
<input name="email" type="text" class="field1" id="textfield2" value=''/> <font color="#FF0000"><strong>*</strong></font><br />
<font color="#FF0000" style="font-family: Verdana, sans-serif;font-size : 9pt;" class="form-list">
</font></td>
</tr>
<td colspan="2" align="center"></td>
</tr>
</table>
</form>
</div>
</div>
</div>
In Javascript:
window.open ("path/to/my/new/html/page.html?id=3","mywindow");
Just like any other page, the get can be used to pass the data you need, you just may need to UrlEncode it first.
EDIT: Oh. You're referring to a modal dialog, not a popup window. Well in that case, since the data will need to be on the page fully once the page loads that way the ID can be present in the link, you have 2 basic options: 1) preload all data for all click links and store it locally in javascript, 2) break this method into an ajax call and update the modal dialog controls with the ajax data.
1) For storing it in javascript, you could easy prototype your own pseudo-class to hold all of the data for each row, allowing you to store them in an associative array by id.
function myDataItem(id, field1) {
this.id = id;
this.field1 = field1;
this.field2 = ""; // initialize a property called field2
this.getInfo = getDataItemIno;
}
function getDataItemIno() {
return this.field1 + ' ' + this.field2;
}
var items;
items[3] = new myDataItem(3, "datastring");
2) The ajax solution would be a little more complex, and I would recommend using jQuery to build/handle all of those methods in order to keep it streamlined and simple.
The easiest way is to pass the id in the url of the popup window