fetch the variable from php to javascript and use it - javascript

THIS IS META.PHP . I AM JUST PASSING SESSION VALUE USING JAVA SCRIPT
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/style.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script src="./js/jquery.js"></script>
<script src="./js/laddubox.js"></script>
<script src="./js/pop.js"></script>
<script src="./js/jquery.js"></script>
<script type="text/javascript">
var page = "<?php echo $_SESSION['pa'] ?>";
</script>
<title><?=$title?></title>
</head>
THIS IS A POP-UP IN JS . NOW I WANT THE SESSION VALUE IN THIS POP-UP AND I HAVE CREATED THE HIDDEN INPUT FIELD TO PASS THE VALUE TO ANOTHER PAGE
function sin() {
var lbox = new LadduBox();
lbox.init({
"width": 500,
"height": 300,
"HTML": '<div style="width:495px; height:272px; background-color:#ffffff; border:2px solid orange;"><table cellspacing="0" cellpadding="0" border="0" align="center" width="485" height="270" style="font-family:arial; font-size:20px; font-weight:bold;"><tr><td align="right" colspan="3"><img src="images/untitled-1.png" style="margin:10px; cursor:pointer;" id="btnClose"/></td></tr><tr><td height="30" colspan="3"><div style="font-family:arial; font-size:20px; color:#ff6c00; padding-left:200px;">SIGN IN</div></td></tr><tr><td><form method="get"><div style="margin:10px; font-size:14px;">EMAIL<br><input type="text" name="email"/></div><br><div style="margin-left:10px; margin-top:-10px; font-size:14px;">PASSWORD<br><input type="hidden" name="page" value=""/><input type="text" name="paswrd"/></div><br><input type="submit" value="submit" class="subbg"/></form></td><td><img src="images/orbar.png" /></td><td align="center"><img src="images/redfb.png" style="margin-bottom:7px;"/><br><img src="images/redgoogle.png" style="margin-bottom:7px;"/><br><img src="images/redtwitter.png" /></td></tr></table></div>',
'btnCloseId': '#btnClose'
});
lbox.fire();
}
SO PLEASE IF ANYONE KNOWS THE ANSWERE PLEASE HELP ME

You have this HTML snippet:
<input type="hidden" name="page" value=""/>
Just insert PHP value there as:
<input type="hidden" name="page" value="<?php echo $_SESSION['pa'] ?>"/>

Is it as simple as you are just missing the semicolon at the end of the php statement?
var page = "";

Related

Issue with dirty form jQuery plugins

I am having trouble using two plugins. I have tried:
https://github.com/snikch/jquery.dirtyforms
https://github.com/codedance/jquery.AreYouSure
In my code I am using:
<script>
$(funtion() {
$('form').dirtyForms();
});
</script>
Or
<script>
$(funtion() {
$('form').areYouSure();
});
</script>
within my header and when I change elements of the form and try to refresh I get no dialouge. I am struggling to work out how I can tell if it's being called at all.
I can't for the life of me get it to work. Any ideas?
Below is a view source example of a page with it in:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="styles/header.css?v=1.0">
<link rel="stylesheet" href="styles/content.css?v=1.0">
<link rel="stylesheet" href="styles/footer.css?v=1.0">
<link rel="stylesheet" href="styles/jquery.datetimepicker.css?v=1.0">
<script src="scripts/jquery191.min.js"></script>
<script src="scripts/mdetect.js" type="text/javascript"></script>
<script type="text/javascript">
if(MobileEsp.DetectTierIphone() == true) {
var metaTag=document.createElement('meta');
metaTag.name = "viewport"
metaTag.content = "width=device-width, initial-scale=0.4, maximum-scale=1.0, user-scalable=1"
document.getElementsByTagName('head')[0].appendChild(metaTag);
}
if(MobileEsp.DetectTierTablet() == true) {
var metaTag=document.createElement('meta');
metaTag.name = "viewport"
metaTag.content = "width=device-width, initial-scale=0.75, maximum-scale=1.0, user-scalable=1"
document.getElementsByTagName('head')[0].appendChild(metaTag);
}
</script>
<script type="text/javascript" src="scripts/jquery.tablesorter.js"></script>
<script type="text/javascript" src="scripts/jquery.tablesorter.widgets.js"></script>
<script type="text/javascript" src="scripts/widget-print.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBTHOXfueJyei11NqPw3rRjhjj_yjcdV-E&callback=initMap"></script>
<script src="scripts/jquery.datetimepicker.full.min.js"></script>
<script src="scripts/jquery.form.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.dirtyforms/2.0.0/jquery.dirtyforms.min.js"></script>
<script type="text/javascript" language="JavaScript">
<!--
function HideContent(d) {
document.getElementById(d).style.display = "none";
}
function ShowContent(d) {
document.getElementById(d).style.display = "block";
}
function ReverseDisplay(d) {
if(document.getElementById(d).style.display == "none") { document.getElementById(d).style.display = "block"; }
else { document.getElementById(d).style.display = "none"; }
}
//-->
</script>
<script>
$(document).ready(function(){
$("BodyshopAddress").each(function(){
var embed ="<iframe width='200' height='200' frameborder='0' scrolling='no' marginheight='0' marginwidth='0' style='margin-left:30px;' src='https://maps.google.com/maps?&q="+ encodeURIComponent( $(this).text() ) +"&output=embed&iwloc'></iframe>";
$(this).html(embed);
});
});
</script>
<script>
$(funtion() {
$('form').dirtyForms();
});
</script>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="container">
<div class="MainHeader">
...
</div>
<div class="logged_container">
...
</div>
<div class="navigation_container">
...
</div>
<div style="position:absolute; top:0; right:0; margin-right:10px; margin-top:5px; background-color:#4771A5; border-radius:3px; padding:5px; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.05) inset, 0px 0px 25px rgba(82, 168, 236, 0.7);">
<form id="myForm" action="" method="POST">
<input type='text' size='20' name='Poke' placeholder='Magic Poking Stick' style="margin-right:5px; vertical-align:middle; text-align:center;"> <input type='submit' name='BadBoyPoke' value='' class='submit' title='Search' maxlength="3" style='background-image:url("img/bms121.png"); vertical-align:middle;' >
</form>
</div>
<script>
$(document).ready(function()
{
$('#RepairerNetworkTable').tablesorter({
widthFixed : true,
headerTemplate : '{content} {icon}', // Add icon for various themes
widgets: [ 'stickyHeaders', 'filter', 'print' ],
widgetOptions: {
stickyHeaders_attachTo : '.wrapper',
print_title : '', // this option > caption > table id > "table"
print_dataAttrib : 'data-name', // header attrib containing modified header name
print_rows : 'f', // (a)ll, (v)isible or (f)iltered
print_columns : 's', // (a)ll, (v)isible or (s)elected (columnSelector widget)
print_extraCSS : '', // add any extra css definitions for the popup window here
print_styleSheet : 'styles/tablePrint.css', // add the url of your print stylesheet
print_callback : function(config, $table, printStyle){
$.tablesorter.printTable.printOutput( config, $table.html(), printStyle );
}
}
});
$('.print').click(function(){
$('.tablesorter').trigger('printTable');
});
}
);
</script>
<div class="content">
<div class="contentTableView">
<a href="#" class="print" style="float:right; margin-right:20px;">
<img src="img/bms91.png" alt="" height="16" style="vertical-align:top; padding-right:5px;">Print</a>
</div>
<br /><br />
<div class="GridViewContainer wrapper">
<table id="RepairerNetworkTable" class="tablesorter">
...
</table>
</div>
<br />
<div class="TabbedViewContainer">
<div class="TabbedNavContainer">
<div style="position: relative; top: 50%; transform: translateY(-50%);">
<form action="" method="post">
<a style="text-decoration:underline !important;" href="repairer_network.php?RepNetID=9&RepNetTab=Info">Info</a>
Work Providers / Brokers
Bodyshops
<input name="submitInfo" type="submit" value="Change Repairer Network's Info" />
</div>
</div>
<div style="text-align:left; padding-left:10px; padding-top:10px;">
<span style="font-size: 12px; font-weight:bold;">Repairer Network Info: </span>
<br />
<hr size='1' style=" margin: 5px 10px 5px 0; ">
<table style="float:left;">
<tr>
<td>Name: </td>
<td><input name="BusinessName" type="text" size="30" value="AI Claims Solutions (UK) Ltd"/> </td>
</tr>
<tr>
<td>Email: </td>
<td><input name="BusinessEmail" type="text" size="30" value=""/></td>
</tr>
<tr>
<td>Phone: </td>
<td><input name="BusinessPhone" type="text" size="30" value=""/></td>
</tr>
</table>
</form>
</div>
</div>
<br />
</div>
<div class="footer">
...
</div>
</div>
</body>
</html>
It's simple to use. Just add the following line to your page's ready function:
$('form').areYouSure(); Are You Sure? - A light "dirty forms" JQuery Plugin
$(document).ready(function(){
$('form').areYouSure();
});
That's what the plugin says... it listen to the element $('form') (you could use an id or class) and when the "event" "areYouSure()" occurs, the plugin will trigger...

AutoIT IE logging in not finding objects

I got AutoIt to work with my router login page. However for our HP Pro Curve Switch.. I can't get it to work...
#NoTrayIcon
#include <ie.au3>
$Address = "http://10.255.96.2/index.html"
$pwd="mypassword"
$oIE = _IECreate ($Address)
_IELoadWait($oIE)
$oForm = _IEFormGetObjByName ($oIE, "maindata")
for $stuff in $oForm
if $stuff.name = "password" and $stuff.type = "password" then _IEFormElementSetValue ($stuff, $pwd)
If $stuff.value == "Login" and $stuff.type = "submit" Then $stuff.click
Next
exit
I get "H:\loginToSwitch.au3" (10) : ==> Variable must be of type "Object".:
Basically the "maindata" is incorect.
Here is the HTML if I right click on the page and view source:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html><head>
<meta name=Copyright content="Copyright (c) 2005 HP Networks, Inc. All Rights Reserved.">
<meta http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<meta http-equiv="Pragma" content="no-cache">
<title>HP Networks Web Interface</title>
<script src="/mainjs.js" language=javascript type="text/javascript"></script>
<script language="javascript" type="text/javascript">
//<!--
checkFrame(); // Ensure we are not within a frame
implementLoginFrames('login.html');
document.write('<noframes>');
//-->
</script>
</head>
<body BGCOLOR="#DAE3EB">
<center>
<font color="#008BD1" face="Arial, Helvetica, sans-serif"><B>Please ensure that your browser supports Frames and Javascript, and that they are both enabled.</b></font>
</center>
<script language="javascript" type="text/javascript">
//<!--
document.write('<\/noframes>');
//-->
</script>
</body>
</html>
However, when I use firefox to identify elements... it gives me a completely different code (which is what I got the buttons and textbox info from):
<html>
<head></head>
<frameset framespacing="0" border="0" frameborder="0" rows="80,*">
<frameset framespacing="0" border="0" frameborder="0" cols="*,22"></frameset>
<frame src="login.html" noresize="" name="loginFrame" scrolling="auto">
#document
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head></head>
<body onload="loadConfiguration();">
<script type="text/javascript" language="javascript"></script>
<form onsubmit="return login();" name="tF" method="post" action="login.html">
<table class="container" style="height: 650px">
<tbody>
<tr>
<td class="container">
<div class="container">
<div class="loginbox">
<!--
Login box HTML code here...
-->
<table class="login">
<tbody>
<tr>
<td id="devname" class="hdr style2" style="color: #ffffff; font-family: Arial, Helvetica, sans-serif;" colspan="2"></td>
</tr>
<tr>
<td class="hdr style2" valign="top"></td>
<td class="maindata">
<input id="password" type="password" onkeypress="capsCheck(event);" size="20" name="password" maxlength="16"></input>
<script type="text/javascript" language="javascript"></script>
<input class="button" type="submit" style="position: relative; top: 2;" value="Login"></input>
<br></br>
<span id="passwd" class="default" style="display: none;"></span>
</td>
</tr>
<tr></tr>
<tr></tr>
</tbody>
</table>
<span id="wrong" class="warning" style="display: none;"></span>
<br></br>
<span id="capsmsg" class="warning" style="display: none;"></span>
<br></br>
It is recommended that you use a minimum of
<br></br>
Microsoft® Internet Explorer 5.5 to view the Inter…
<br></br>
<br></br>
<!--
Login box HTML end...
-->
</div>
</div>
</td>
</tr>
</tbody>
</table>
<script type="text/javascript" language="javascript"></script>
</form>
</body>
</html>
</frame>
</frameset>
<noframes></noframes>
</html>
_IEFormGetObjByName() Returns an object variable, not a collection.
Use _IETagNameAllGetCollection($oForm) to list all of the element inside a object.
Edit:
I have looked closely to the html and I see that the password field has ID and NAME attributes. Use _IEGetObjById to get the object of a password field.
#NoTrayIcon
#include <ie.au3>
$Address = "http://10.255.96.2/index.html"
$pwd="mypassword"
$oIE = _IECreate ($Address)
;_IELoadWait($oIE) Not needed because IECreate does wait for page to load by default.
$oPassword = _IEGetObjById($oIE, "password")
_IEFormElementSetValue ($oPassword, $pwd)
$oForm = _IEGetObByName($oIE, "tF")
_IEFormSubmit($oForm)

Using local storage on a listbox

I am working on a history search function.
I have managed to get a working code to save the value from the textbox but I do not know how to load them into a listbox.
I want a listbox with clickable items so that I can click on a previous search value and load that value as I do from the textbox.
Here is my code:
<!doctype html>
<html lang="en">
<head>
<title>Test</title>
<meta charset="utf-8>
<link rel="stylesheet" type="text/css" href="test.css">
<script src="jquery.js"></script>
<script src="j.js"></script>
</head>
<body>
<center>
<table>
<tr>
<td style="text-align: center">
<font size="22">Sök order</font>
</td>
</tr>
<tr>
<td>
<form action="test.php" method="post">
<input style="font-size: 44pt; text-align: center" size="9" type="text" name="txtSearch" id="txtSearch"/>
<input type="submit" id="submit" value="submit">
</form>
</td>
</tr>
</table>
</center>
</body>
</html>
And the j.js that handles the local storage function.
$(function () {
$("#submit").click(function () {
var txtSearch = $("#txtSearch").val();
localStorage.setItem('searchvalue',txtSearch);
});
});
And last my test.php that handles the post search request
<?php
$txtSearch = $_REQUEST['txtSearch'];
header('Location: '.'https://mywebsite.com/se/editor/order_info.php?webshop=23946&ordernr='.$txtSearch);
?>
How can I achieve this?
Thank you.
by js, you can
window.location = "https://mywebsite.com/se/editor/order_info.php?webshop=23946&ordernr="+localStorage.getItem('searchvalue');
to save in listbox or any other
document.getElementById("id").value=localStorage.getItem('searchvalue');
to save in array
var a = [];
a[0]=localStorage.getItem('searchvalue');

How to do calculations in HTML forms using JavaScript?

I am building a simple app that multiplies a number entered by the user by 5 and displays the result. Since, I am a beginner, I need some help with this.
Here's my HTML code:
<!DOCTYPE html>
<head>
<title>Area Calc</title>
<link rel='stylesheet' type='text/css' href='style.css'/>
<link href='http://fonts.googleapis.com/css?family=Titillium+Web' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Exo+2' rel='stylesheet' type='text/css'>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type='text/javascript' src='script.js'></script>
<head>
<body>
<div class="heading">Number Of Persons Calc</div>
<div style=" color: white; text-align:auto; width:400px; margin-right:auto; margin-left:auto; border:1px solid white; margin-top: 120px;">
<form method="" action="">
<input type="text" name="area" placeholder="Enter in square metres!" class="input" />
<input class="submit" type="submit" value="Submit" class="button" />
</form>
</div>
<body>
<html>
Can someone tell me what JavaScript/jQuery code could possibly take the value entered by the user from the text input element and multiply it by 5 and then display the result to the user? Please help me with this.
HTML
<input type="text" name="area" placeholder="Enter in square metres!" id="op" class="input" />
<input class="submit" type="button" value="Submit" class="button" onClick="mulBy()" />
SCRIPT
function mulBy(){
var op1=parseFloat(document.getElemntById("op").value);
val ans=op1*5;
alert(ans);
}
suppose you want to display the answer in a div having id "result":
<input type="text" name="area" placeholder="Enter in square metres!" class="input" />
<input class="submit button" type="submit" value="Submit" />
<div id="result"></div>
This div is placed just after the submit button. Now write the following code after the line:
<script type='text/javascript' src='script.js'></script>
$(document).ready(function(){
$(".submit ").click(function(){
$("#result").html(parseInt($(".input").val())*5);
return false;
});
});
Calculate in HTML without using Form and submit button
HTML
<input type="text" id="area" name="area" placeholder="Enter in square metres!"
class="input"/>
<br/>
<div id="result"></div>
JqueryCode
$(document).ready(function(){
$("input#area").change(function(){
var input_box = $('#area').val();
if ( input_box != ''){
$("div#result").html(input_box*5);
}
else{
$("div#result").html("");
}
});
});
LiveDemo JsFiddle

Getting form value from PHP in JQuery

I want to get a form input value from a php file to a javascript one, like this:
PHP file:
<html>
<head>
<meta charset = "UTF-8">
<title> Search Customer by Field </title>
<script type="text/javascript" src="../lib/jquery-1.10.2.js"></script>
<script type="text/javascript" src="../src/search-by-invoice-no.js"></script>
<table id="results" border="1"></table>
</head>
<body>
<?php
if( isset($_GET["invoiceNo"]) && "" != $_GET["invoiceNo"])
{
}
else
{
?>
<form id = "form1">
Invoice Number <input id="invoice" name="invoiceNo" type="text" value="<?=isset($_GET['invoiceNo'])? $_GET['invoiceNo'] :""?>">
<br/>
<input id="submit_btn" type="submit">
</form>
<?php
}
?>
</body>
</html>
JS file:
$(document).ready(function() {
var invoiceNo = $('#invoice').val(); //Returns undefined
alert(invoiceNo);
//etc...
Why this behaviour? I tried saveral other methods but all of them failed.
Your if/else structure makes no sense. If $_GET['invoiceNo'] exists and isn't empty, then you do your if logic, so the form is never created. But then, in your form, you check to see if $_GET['invoiceNo'] exists. It never will, except if it's empty, so what's the point of using it there?
You have a couple errors: inverted if/else is the reason you are not getting a value and among other things you are missing a parenthesis on your php output inside the input and input elements should end with />
<html>
<head>
<meta charset = "UTF-8">
<title> Search Customer by Field </title>
<script type="text/javascript" src="../lib/jquery-1.10.2.js"></script>
<script type="text/javascript" src="../src/search-by-invoice-no.js"></script>
</head>
<body>
<?php
if( isset($_GET["invoiceNo"]) && "" != $_GET["invoiceNo"])
{ ?>
<form id = "form1" action='mypage.php' method='GET'>
Invoice Number <input id="invoice" name="invoiceNo" type="text" value="<?php echo (isset($_GET['invoiceNo']))? $_GET['invoiceNo'] :""; ?>" />
<br/>
<input id="submit_btn" type="submit" />
</form>
<?php
}
else
{
?>
<p>No value received</p>
<input id="invoice" name="invoiceNo" type="hidden" value="0" />
<?php
}
?>
</body>
</html>
Also, you don't even need to check if it is set as you already do, so something like
Invoice Number <input id="invoice" name="invoiceNo" type="text" value="<?php echo $_GET['invoiceNo']; ?>" />
Will work fine too
EDIT
<html>
<head>
<meta charset = "UTF-8">
<title> Search Customer by Field </title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
$(document).ready(function(){
var invoice = $('#invoice').val();
if(invoice == 0)
{
alert('No value was passed');
}
else
{
alert(invoice);
}
});
</script>
</head>
<body>
<?php
if( isset($_GET["invoiceNo"]) && "" != $_GET["invoiceNo"])
{ ?>
<form id = "form1" action='mypage.php' method='GET'>
Invoice Number <input id="invoice" name="invoiceNo" type="text" value="<?php echo $_GET['invoiceNo']; ?>" />
<br/>
<input id="submit_btn" type="submit" />
</form>
<?php
}
else
{
?>
<p>No value received</p>
<input id="invoice" name="invoiceNo" type="hidden" value="0" />
<?php
}
?>
</body>
</html>

Categories

Resources