|
JavaScript - Update On Exterior Change
Hello all,
This may be a question more appropriate for the PHP section. How do you get javascript to change on a database action. Ok tough to explain, but for instance in gmail you receive instant messages when someone else hits enter and sends it. How do you get a change on your screen when they make a change on their client. -Questionable Similar TutorialsI am current building an information database for the company I work at...basically just a place for employees to get information and answers from. It is all hosted on a local server and I can only use javascript, html, and css. Ive got everything made there is just one thing i want to add to it. basically an "alerts and updates" page that only some people can edit without having to know html so if im not there they can post important updates. no computers have access to the internet so I did try some rich text editors but none of them worked. the lay out I'm going for is kind of like this. ------------------------------------ Alerts and Updates Click on links to show updates: update 1 * update 2 * update 3 * update 4 stuff goes in the update [edit button] ------------------------------------- you click edit it prompts you to login, bring up something to edit the text in that specific update you hit submit and it changes the info that was on there. The update links are linked to a script i wrote that just display the info below so when the page loads you see whats in update 1 then you click update and it changes the content to the next one. i dont know if there is any way to do this in javascript and html. any help or a good direction to start would be great...thanks. http://www.***.com/5.html i cant get a caption specific to each image to display under the arrows when the image changes. it is especially hard for me because i have to edit the javascript which confuses the **** out of me. it seemed so simple.... thanks for any help ps i cant start an id with a digit? it doesnt seem to cause any problems...why is it stated that this cannot or shouldnot be done? Hello, Current Live View: https://tornhq.com/AroundTheWorld/Lo...WorkingOn.html This content is going to be implemented into a form I am currently working on once completed. As you can see, not all of the countries have yet been broken down as some we're having difficulties doing so. Code: SList.getSelect = function (slist, option) {
document.getElementById('scontent').innerHTML = ''; // empty option-content
if (SList[slist][option]) {
// if option from the last Select, add text-content, else, set dropdown list
if (slist == 'scontent') document.getElementById('scontent').innerHTML = SList[slist][option];
else {
var addata = '<option>- - -</option>';
for (var i = 0; i < SList[slist][option].length; i++) {
addata += '<option value="' + SList[slist][option][i] + '">' + SList[slist][option][i] + '</option>';
}
// cases for each dropdown list
switch (slist) {
case 'slist2':
document.getElementById('slist2').innerHTML = txtsl2 + ' <select name="slist2" onchange="SList.getSelect(\'slist3\', this.value);">' + addata + '</select>';
document.getElementById('slist3').innerHTML = '';
break;
case 'slist3':
document.getElementById('slist3').innerHTML = txtsl3 + ' <select name="slist3" onchange="SList.getSelect(\'scontent\', this.value);">' + addata + '</select>';
break;
}
}
} else {
// empty the tags for select lists
if (slist == 'slist2') {
document.getElementById('slist2').innerHTML = '';
document.getElementById('slist3').innerHTML = '';
} else if (slist == 'slist3') {
document.getElementById('slist3').innerHTML = '';
}
}
}
I need to know how to edit the following, if there is a simple way to set the case for each one as they are not all split up into the same way, some are Districts, some states and whatnot so the new question varies. Or do I simply need to make another big list to do them all? Best Regards, Tim Reply With Quote 03-21-2013, 06:35 AM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts Well, for starters, this is generally a really bad way to add <select>s and <option>s. Period. I would certainly toss out your entire getSelect() function and rewrite it. But I'm also not clear on what your question is. Are you asking *HOW* to implement the third level? I don't see any countries with any third level data, at this point. If that's what you are asking, one possible way: Code: SList.slist2 = {
...
"United Kingdom" :
{ "England" : ["Staffordshire", "Derby", ... ],
"Scotland" : ["Edinburgh", ... ],
"Wales" : [ ... ],
"Northern Ireland" : [ .... ]
},
...
};
I have to ask: Why would you name that Slist.slist2 instead of Slist.countries ?? Not that it really matters, but why not make code more self documenting? Hi All, I have a web camera stream which exports JPG which are over written (ie; 5 jpg's) looping. I'm streaming this feed however, setInterval - refreshImage, 1000 is not lining up with the streaming feed. Is there a way to update the latest jpg image without using setInterval times. I find that depending on the server the timing can be off, and it overlaps or goes too fast. This is my code. Code: <html>
<head>
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<META HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE">
<META HTTP-EQUIV="Expires" CONTENT="-1">
<META HTTP-EQUIV="Refresh" CONTENT="120;URL=http://www.website.com.au">
<?php
$time = date('G'); //24 hour without leading zeroes
if($time >= 1 && $time <= 6) $loc = 'index.php';
else if($time >= 10 && $time <= 17) $loc = 'index2.php';
else if($time >= 21 && $time <= 24) $loc = 'index3.php';
if(isset($loc)) {
header("Location: http://www.website.com.au/{$loc}");
exit;
}
?>
<script type="text/javascript">
var mypics = [];
mypics[0] = 'images/1.jpg';
mypics[1] = 'images/2.jpg';
mypics[2] = 'images/3.jpg';
mypics[3] = 'images/4.jpg';
mypics[4] = 'images/5.jpg';
var image;
var imageNum = 0;
window.onload = function() {
image = document.getElementById('idofyourimage');
setInterval("refreshImage()", 1000);
}
function refreshImage() {
image.src = mypics[imageNum++] + '?' + (new Date()).getTime();
if (imageNum == mypics.length) imageNum = 0;
}
</script>
</head>
<body>
<script type="text/javascript" language="javascript">
<!--
document.oncontextmenu = function () {return false;};
function do_err()
{
return true
}
onerror=do_err;
function no_cp()
{
clipboardData.clearData();setTimeout("no_cp()",100)
}
no_cp();
//-->
</script>
<img src="images/1.jpg"; id="idofyourimage" width="640" height="360"/>
</body>
Thanks !!! Hi everyone - would anyone be able to assist with a code for updating information on a daily basis? For example, I wish to update a section of our site every day that has the following timing information: Everything is tabulated in excel and/or csv, and it also has on line pages in monthly format, but on the main index page, I just need to have a small area that provides it on a daily basis without having to go to an individual monthly page. Dawn Sunrise Mid Day Sunset Hope this make sense! In the same regard, a code that has QUOTES can also be included with daily (automatic) changes. Any help would be greatly appreciated! Thank you! function amort(balance, interestRate, terms) { var monthlyRate = interestRate/12; var payment = balance * (monthlyRate/(1-Math.pow( 1+monthlyRate, -terms))); var result = "Loan amount: $" + balance.toFixed(2) + "<br />" + "Interest rate: " + (interestRate*100).toFixed(2) + "%<br />" + "Number of months: " + terms + "<br />" + "Monthly payment: $" + payment.toFixed(2) + "<br />" + "Total paid: $" + (payment * terms).toFixed(2) + "<br /><br />"; result += "<table border='1'><tr><th>Month</th><th>Balance</th>" + "<th>Interest</th><th>Principal</th>"; for (var a = 1; a <= terms; ++a){ result += "<tr><td>"+a +"</td>"; //for (var b = balance; b > 0; (balance-payment)){ var updatedBalance = balance;//updated monthly payment var monthRate = monthlyRate*balance;//amount of int per month var monthlyPrincipal = payment-monthRate;//updated monthly principal result += "<td>" + (updatedBalance.toFixed(2))+ "</td>"+ "<td>" + monthRate.toFixed(2) + "</td>" + "<td>" + (monthlyPrincipal.toFixed(2)) + "</td>"; if (balance > 0) { var updateBalance = balance-monthlyPayment; } //} result += "</tr>"; } result += "</table>"; return result; } This is my JS file and I am trying to create a loan table. The table is working and it puts the data in, but the updatedBalance is not decreasing when it goes thru the loop. I thought that if I put an IF statement in to update the amount after each time thru that would fix it. But instead it broke it. Any thoughts. I know im not supposed to use this for someone to write my codes for me but i need help with something the page AtreusComputers is what im working on at the bottom of the page is a price box which i might move to the side or the top later but right now just trying to get it to work here is my html page code Code: <html>
<head>
<title>ACS - Custom Computers</title>
<link rel="stylesheet" href="script.css" />
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-19288524-2']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<script type="text/javascript" src="scripttest.js">
</script>
</head>
<body bgcolor="#000000" text="#ffffff">
<center>
<P align=center ><a href="http://www.atreuscomputerservices.com"><img src="webACSlogofinal.bmp" border="0"></a></P>
<P align=center ><FONT color="#ffffff" size=6 face="Palatino Linotype" ><STRONG><EM>Computer Customization</EM></STRONG></FONT></P>
</center>
<table width="100%" border="0">
<tr>
<td width="10%"></td>
<td width="457px"><center><img src="ACSbanner.bmp" width="457px" height="100%" /></center></td>
<td width="40%"></td>
<td width="20%">
<style type="text/css">
@import url(http://www.google.com/cse/api/branding.css);
</style>
<div class="cse-branding-right" style="background-color:#000000;color:#FFFFFF">
<div class="cse-branding-form">
<form action="http://atreuscomputers.99k.org/google.html" id="cse-search-box">
<div>
<input type="hidden" name="cx" value="partner-pub-3415227737255042:y4oouh-9ccq" />
<input type="hidden" name="cof" value="FORID:11" />
<input type="hidden" name="ie" value="ISO-8859-1" />
<input type="text" name="q" size="31" />
<input type="submit" name="sa" value="Search" />
</div>
</form>
</div>
<div class="cse-branding-logo">
<img src="http://www.google.com/images/poweredby_transparent/poweredby_000000.gif" alt="Google" />
</div>
<div class="cse-branding-text">
Custom Search
</div>
</div>
</td>
</tr>
<tr>
<td align="center" valign="top">
<script type="text/javascript"><!--
google_ad_client = "pub-3415227737255042";
/* 160x600, created 10/24/10 */
google_ad_slot = "6248958700";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</td>
<td width="457px" valign="top" bgcolor="#FFFFFF"><div id="header"><center>
<img id="caseimg" src="start.jpg" /></div>
</td>
<td>
<center>
<form action="#">
<h1>COMPONENTS</h1>
<select id="caseselect" style="width:625px" name="Items" class="select" onchange="swapImage()"; "priceUpdate()";>
<option id="49.99" value="start.jpg">Case</option>
<option id="49.99" value="COOLER MASTER Elite 310red.jpg">COOLER MASTER Elite 310 Red ($49.99)</option>
<option id="49.99" value="COOLER MASTER Elite 310blue.jpg">COOLER MASTER Elite 310 Blue ($49.99)</option>
<option id="49.99" value="COOLER MASTER Elite 310orange.jpg">COOLER MASTER Elite 310 Orange ($49.99)</option>
<option id="49.99" value="COOLER MASTER Elite 310silver.jpg">COOLER MASTER Elite 310 Silver ($49.99)</option>
</select> <br /><br />
<select id="powersupply" style="width:625px">
<option id="0" value="">Power Supply</option>
</select><br /><br />
<select id="motherboard" style="width:625px">
<option id="0" value="">Motherboard</option>
</select><br /><br />
<select id="cpu" style="width:625px">
<option id="0" value="">CPU</option>
</select><br /><br />
<select id="cooling" style="width:625px">
<option id="0" value="">Cooling</option>
</select><br /><br />
<select id="memory" style="width:625px">
<option id="0" value="">Memory</option>
</select><br /><br />
<h1>AUDIO & VIDEO</h1>
<select id="gpu" style="width:625px">
<option id="0" value="">Video</option>
</select><br /><br />
<select id="monitor" style="width:625px">
<option id="0" value="">Monitor</option>
</select><br /><br />
<select id="audio" style="width:625px">
<option id="0" value="">Audio</option>
</select><br /><br />
<select id="cooling" style="width:625px">
<option id="0" value="">Speakers</option>
</select><br /><br />
<h1>STORAGE & MEDIA</h1>
<select id="hd1" style="width:625px">
<option id="0" value="">Hard Drive 1</option>
</select><br /><br />
<select id="hd2" style="width:625px">
<option id="0" value="">Hard Drive 2</option>
</select><br /><br />
<select id="od1" style="width:625px">
<option id="0" value="">Optical Drive 1</option>
</select><br /><br />
<select id="od2" style="width:625px">
<option id="0" value="">Optical Drive 2</option>
</select><br /><br />
<select id="mediaread" style="width:625px">
<option id="0" value="">Media Reader</option>
</select><br /><br />
<h1>COMMUNICATION & NETWORKING</h1>
<select id="netadapt" style="width:625px">
<option id="0" value="">Network Adapter</option>
</select><br /><br />
<select id="wifi" style="width:625px">
<option id="0" value="">WiFi Adapter</option>
</select><br /><br />
<select id="router" style="width:625px">
<option id="0" value="">Router</option>
</select><br /><br />
<select id="modem" style="width:625px">
<option id="0" value="">Modem</option>
</select><br /><br />
<select id="usb" style="width:625px">
<option id="0" value="">USB Ports</option>
</select><br /><br />
<select id="bt" style="width:625px">
<option id="0" value="">Bluetooth</option>
</select><br /><br />
<h1>SOFTWARE</h1>
<select id="os" style="width:625px">
<option id="0" value="">Operating System</option>
</select><br /><br />
<select id="productsoftware" style="width:625px">
<option id="0" value="">Productivity Software</option>
</select><br /><br />
<select id="Secure" style="width:625px">
<option id="0" value="">Security Software</option>
</select><br /><br />
<h1>ACCESORIES</h1>
<select id="keyboard" style="width:625px">
<option id="0" value="">Keyboard</option>
</select><br /><br />
<select id="mouse" style="width:625px">
<option id="0" value="">Mouse</option>
</select><br /><br />
<select id="netcable" style="width:625px">
<option id="0" value="">Network Cable</option>
</select><br /><br />
<select id="cam" style="width:625px">
<option id="0" value="">Web Cam</option>
</select><br /><br />
<select id="surge" style="width:625px">
<option id="0" value="">Surge Protector</option>
</select><br /><br />
</form><br /><br />
<input type="text" id="total" value="?" width="625px"></input>
</center>
</td>
<td valign="top" align="center">
<script type="text/javascript"><!--
google_ad_client = "pub-3415227737255042";
/* 300x250, created 10/24/10 */
google_ad_slot = "4027168799";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></td>
</tr>
</table>
</body>
</html>
and here is my js code Code: window.onload = initForm;
function swapImage(){
var image = document.getElementById("caseimg");
var dropd = document.getElementById("caseselect");
image.src = dropd.value;
}
function priceUpdate() {
var itemprice = document.getElementById("caseselect");
var box = document.getElementById("total")
box.value = itemprice.id;
}
*PARTS IN RED ARE WHAT IM WORKING ON Hello, I'm somewhat new to JavaScript and for my website, I decided to make a clock for the website in this format: Saturday, October 17, 2009 5:56:14 p.m. The only issue is that it won't update every second. Below is the coding: External JavaScript: Code: function dateClock()
{
// Coding
}
setTimeout("dateClock()", 1000);
HTML: Code: ...
<script src="date.js" type="text/javascript">
</script>
</head>
<body>
<script type="text/javascript">
document.write("<p style='margin:-15px 0px;background-color:black;position:fixed;padding:5px;'>"+Day+", "+Month+" "+date+", "+Year+"<br />"+Hour+":"+Minute+":"+Sec+" "+Suffix+"</p>");
</script>
What can I do to make it update? Thanks. Here is my calander script PHP Code: <script src="http://www.runningprofiles.com/jquery.js" type="text/javascript"></script> <link href="http://www.runningprofiles.com/members/diary/facebox/facebox.css" media="screen" rel="stylesheet" type="text/css"> <script src="http://www.runningprofiles.com/members/diary/facebox/facebox.js" type="text/javascript"></script> <script> jQuery(document).ready(function($) { $('a[rel*=facebox]').facebox() }) </script> <?php // there is NO NEED to edit ANY of this code $ev_dat = array(); for ($i=0;$i<32;$i++) { $ev_dat[$i]=0; } $now = date("Y-m-d", time()); list($ty, $tm, $td) = explode('-',$now); // ty=thisyear, etc. used for highlighting 'today' include("cal_parms.php"); // assorted configuration variables include($dat_names); // retrieved from cal_parms.php as a 'language' file if (!isset($_GET['m'])) { $m = date("m",mktime()); } else { $m = $_GET['m']; } if (!isset($_GET['y'])) { $y = date("Y",mktime()); } else { $y = $_GET['y']; } /*== get what weekday the first is on ==*/ $tmpd = getdate(mktime(0,0,0,$m,1,$y)); $month = $tmpd["month"]; $firstwday= $tmpd["wday"]; if ($firstDayIsMonday == 1) { if ($firstwday == 0) { $firstwday = 6; } else { $firstwday--; } } $lastday = mk_getLastDayofMonth($m,$y); /*== get the last day of the month ==*/ function mk_getLastDayofMonth($mon,$year) { for ($tday=28; $tday <= 31; $tday++) { $tdate = getdate(mktime(0,0,0,$mon,$tday,$year)); if ($tdate["mon"] != $mon) { break; } } $tday--; return $tday; } // compute range of dates for this month to match dates in database in the format yyyy-mm-dd if (strlen($m)<2) { $q="0"; $q.=$m; } else { $q = $m; } $dats_beg = $y. "-". $q. "-01"; $dats_en = $y. "-". $q. "-". $lastday; // open db conn and select all records where date is between $dats_beg and $dats_en include("cal_db_conn.php"); mysql_connect($db_host, $db_login, $db_pass) or die ("Can't connect!"); mysql_select_db($db_name) or die ("Can't open database!"); $query = "SELECT * FROM $db_table WHERE (ev_dat>='$dats_beg') AND (ev_dat<='$dats_en') "; $result = mysql_db_query($db_name, $query); // any matches? if ($result) { // handle the matches and pass relevant info to arrays while ($myrow = mysql_fetch_array($result)) { $found = $myrow['ev_dat']; $pieces = explode("-", $found); $dd = intval($pieces[2]); $ev_dat[$dd] = $myrow['id']; } } ?> <table cellpadding="1" cellspacing="1" border="0" bgcolor="#<? echo $bg_edge; ?>"> <tr><td colspan="7" bgcolor="#<? echo $bg_top; ?>"> <table cellpadding="1" cellspacing="1" border="0" width="100%"> <tr bgcolor="#<? echo $bg_top; ?>"><th width="20" style="<?php echo $hcell; ?>"><a href="<? echo $username; ?>&m=<?=(($m-1)<1) ? 12 : $m-1 ?>&y=<?=(($m-1)<1) ? $y-1 : $y ?>"><img src='http://www.runningprofiles.com/calendar/images/prev.gif' height='18' width='18' alt='' border='0' /></a></th> <th style="<?php echo $hcell; ?>"> <?php echo "<a href='../members/diary/show-month.php?mon=". $m. "&yr=". $y. "'rel=\"facebox\">"; echo "<span style='text-decoration:none'>". $mo[intval($m)]. " ". $y. "</span></a>"; ?> </th> <th width="20" style="<? echo $hcell; ?>"><a href="<? echo $username; ?>&m=<?=(($m+1)>12) ? 1 : $m+1 ?>&y=<?=(($m+1)>12) ? $y+1 : $y ?>"><img src='http://www.runningprofiles.com/calendar/images/next.gif' height='18' width='18' border='0' alt='' /></a></th> </tr> </table> </td></tr> <tr bgcolor="#<? echo $bg_top; ?>"> <th width="20" style="<?php echo $hcell; ?>"><? echo $da[1]; ?></th> <th width="20" style="<?php echo $hcell; ?>"><? echo $da[2]; ?></th> <th width="20" style="<?php echo $hcell; ?>"><? echo $da[3]; ?></th> <th width="20" style="<?php echo $hcell; ?>"><? echo $da[4]; ?></th> <th width="20" style="<?php echo $hcell; ?>"><? echo $da[5]; ?></th> <th width="20" style="<?php echo $hcell; ?>"><? echo $da[6]; ?></th> <th width="20" style="<?php echo $hcell; ?>"><? echo $da[7]; ?></th> </tr> <? $d = 1; $wday = $firstwday; $firstweek = true; /*== loop through all the days of the month ==*/ while ( $d <= $lastday) { /*== set up blank days for first week ==*/ if ($firstweek) { if ($wday!=0) { echo "<tr bgcolor='#". $bg_tabl. "'>\n"; for ($i=1; $i<=$firstwday; $i++) { echo "<td style='". $tcell. "' bgcolor='#". $bg_fill. "'> </td>\n"; } } /*== Sunday start week with <tr> ==*/ else { echo "<tr bgcolor='#". $bg_tabl. "'>\n"; } $firstweek = false; } /*== check for event ==*/ echo "<td style='". $tcell. "' "; // is this day 'today' AND there's no event today if (($ty==$y) && ($tm==$m) && ($td == $d) && (!$ev_dat[$d])) { echo "bgcolor='#". $bg_now. "'>". $d; } elseif ($ev_dat[$d]) { // get what's happening that day and use as 'mouseOver' for the link $query = "SELECT * FROM $db_table WHERE id=$ev_dat[$d] "; $result = mysql_query($query); $ev = mysql_fetch_array($result); $titl = $ev['ev_title']; echo "bgcolor='#". $bg_act. "'>"; $url = "../members/diary/show.php?event=". $ev_dat[$d]. "&sho=". $win_sho; echo "<a href=' $url' rel=\"facebox\" title=\"". $titl. "\">". $d. "</a>"; } else { echo "bgcolor='#". $bg_days. "'>". $d; } echo "</td>\n"; /*== Saturday end week with </tr> ==*/ if ($wday==6) { echo "</tr>\n"; } $wday++; $wday = $wday % 7; if (($wday==0) AND ($d!=$lastday)){ echo "<tr bgcolor='#". $bg_tabl. "'>\n"; } $d++; } // and close off the table if (($wday!=7) AND ($wday!=0)) { for ($i=$wday; $i<=6; $i++) { echo "<td style='". $tcell. "' bgcolor='#". $bg_fill. "'> </td>\n"; } echo "</tr>"; } echo "\n</table>"; include("win_open.php"); ?> what would be the best way to make it so that if you wish to chnage the month it changed the month on page rather than refresh the whole page its on? Hi all, I need some help to update my table.It consists about selecting one team from each two drop-down list and enter the score to the two textbox. Textbox 1 relate to the team selected from the first drop-down list and textbox2 relate to the team selected from the second drop-down list.If the score entered in textbox1 is greater than textox2 means that team selected from the first drop-down win and need to update the point of the related team in the table. win = 3 point draw = 1 point lost = 0 point Here what I have down so far...any idea or referencing how I can tackle this task? Code: <form id="foot">
<label for="first">Please select the first team:</label>
<select id="first">
<option value="team 1">team 1</option>
<option value="team 2">team 2</option>
<option value="team 3">team 3</option>
</select>
<label for="second">Please select the second team:</label>
<select id="second">
<option value="team 1">team 1</option>
<option value="team 2">team 2</option>
<option value="team 3">team 3</option>
</select>
<input type="submit" value="Update"/><br/>
<label for="username">Enter score for the match (First team and Second team)</label>
<input type="text" id="txtbox1" size="2"/>
<input type="text" id="txtbox2" size="2"/>
</form><br/>
<table border="1" width="50%" id="score">
<thead>
<tr>
<th>Team</th>
<th>Point</th>
</tr>
<tbody>
<tr>
<td>Team 1</td>
<td>30</td>
</tr>
<tr>
<td>Team 2</td>
<td>20</td>
</tr>
<tr>
<td>Team 3</td>
<td>10</td>
</tr>
</tbody>
</thead>
</table>
function updateTable(){ var form = document.getElementById("foot"); var firstdrop = document.getElementById("first"); var seconddrop = document.getElementById("second"); var box1 = ParseInt(document.getElementById("txtbox1").value); var box2 = ParseInt(document.getElementById("txtbox2").value); var table = document.getElementById("score"); arrwin = ["3"]; arrdraw = ["1"]; arrlost = ["0"]; } </script> Hi Guys, What i'm attempting to do is update a mysql database through a javascript function, so when i click on <a href='onclick="return myfunction();"'></a> PHP Code: function myfunction(affURL) { if (confirm('You will now be redirected to the purchase page, continue?')) { // Need a way to log things, update mysql with vars passed through var l = screen.availWidth / 2 - 450; var t = screen.availHeight / 2 - 320; var win = window.open(affURL, 'payPopupMain', 'width=900,height=650,left='+l+',top='+t+',scrollbars=1'); } else { // Send them back to the payment.php page window.location('payment.php'); } } The code above opens up a browser for the user, but i also want to update mysql without the user seeing any of it, so all they see if the browser popup, and behind the scenes the script updates mysql with a few variables any help on what i would need to do would be appeciated. thanks guys Graham Hi All, I'm using the following code to (try to) update the style of an element in javascript. As you'll no doubt gather from the code, I'm trying to edit the opacity of the element. This code executes fine in FF, Opera and Chrome. However, Internet explorer keeps responding with 'style is null or not an object'. Basically, I don't think it's returning the correct element from the DOM, or, for that matter, any element. To add some more specific guidance, on the homepage I call launch_randomise() in the onload method, which, after 5 seconds, calls randomise_bottom_images() which calls itself and the bottom image regeneration function every 5 seconds, ensuring the images are regenerated every five seconds. Regenerating the bottom images is a three-step process: 1, fade out, 2 switch innerHTML, 3, fade back in. My functions for altering the opacity or innerHTML quite obviously rely on being able to talk about a DOM object, I know no other way of achieving this. I tried straight out getElementById but this doesn't seem to work in IE8, fine in FF, Op, GC. So, after much googling I replaced getElementById(string) with my own getElement(string). However, this still doesn't work. Any thoughts? Any help would be much appreciated!! Getting elements/setting style functions Code: function getElement(id, type)
{
var inputs = document.getElementsByTagName(type);
var descField = null;
for(var i=0;i<inputs.length;i++)
{
if(inputs.item(i).getAttribute('id') == id )
{
descField = inputs.item(i);
break;
}
}
return descField;
}
// setStyleById: given an element id, style property and
// value, apply the style.
// args:
// i - element id
// p - property
// v - value
//
function setStyleById(i, p, v) {
//var n = document.getElementById(i);
var n = getElement(i, 'div');
n.style[p] = v;
}
Full Code: Code:
function getElement(id, type)
{
var inputs = document.getElementsByTagName(type);
var descField = null;
for(var i=0;i<inputs.length;i++)
{
if(inputs.item(i).getAttribute('id') == id )
{
descField = inputs.item(i);
break;
}
}
return descField;
}
// setStyleById: given an element id, style property and
// value, apply the style.
// args:
// i - element id
// p - property
// v - value
//
function setStyleById(i, p, v) {
//var n = document.getElementById(i);
var n = getElement(i, 'div');
n.style[p] = v;
}
function replace_html(el, html) {
if( el ) {
oldEl = (typeof el === "string" ? document.getElementById(el) : el);
newEl = document.createElement(oldEl.nodeName);
// Preserve any properties we care about (id and class in this example)
newEl.id = oldEl.id;
newEl.className = oldEl.className;
//alert(newEl.id);
//set the new HTML and insert back into the DOM
newEl.innerHTML = html;
// alert(newEl.innerHTML);
if(oldEl.parentNode)
oldEl.parentNode.replaceChild(newEl, oldEl);
else
oldEl.innerHTML = html;
//return a reference to the new element in case we need it
return newEl;
}
};
function populate_array()
{
// this function's sole job is to populate the array of items to be used.
var da = new Array(8);
da[0] = new Array(3);
da[0][0] = "portfolio/garage_conversion_before.jpg";
da[0][1] = "portfolio/garage_into_kitchen.jpg";
da[0][2] = "pfimage1";
da[1] = new Array(3);
da[1][0] = "portfolio/refurb_old.jpg";
da[1][1] = "portfolio/refurb_new.jpg";
da[1][2] = "pfimage2";
da[2] = new Array(3);
da[2][0] = "portfolio/fireplace_old.jpg";
da[2][1] = "portfolio/fireplace_new.jpg";
da[2][2] = "pfimage3";
da[3] = new Array(3);
da[3][0] = "portfolio/bathroom1_old.jpg";
da[3][1] = "portfolio/bathroom1_new.jpg";
da[3][2] = "pfimage4";
da[4] = new Array(3);
da[4][0] = "portfolio/kitchen1_old.jpg";
da[4][1] = "portfolio/kitchen1_new.jpg";
da[4][2] = "pfimage5";
da[5] = new Array(3);
da[5][0] = "portfolio/bathroom2_old.jpg";
da[5][1] = "portfolio/bathroom2_new.jpg";
da[5][2] = "pfimage6";
da[6] = new Array(3);
da[6][0] = "portfolio/bathroom3_old.jpg";
da[6][1] = "portfolio/bathroom3_new.jpg";
da[6][2] = "pfimage7";
da[7] = new Array(3);
da[7][0] = "portfolio/ext1_old.jpg";
da[7][1] = "portfolio/ext1_new.jpg";
da[7][2] = "pfimage8";
return da;
}
function switchimage(folioItemNum, ImageState)
{
var isOpera, isIE = false;
if(typeof(window.opera) != 'undefined'){isOpera = true;}
if(!isOpera && navigator.userAgent.indexOf('Internet Explorer')){isIE = true;}
// folioItemNum tells us which folio item to access,
// ImageState tells us which image to set.
// we will use ajax/dom to re-write the document.
var OldImageState = 1 - ImageState;
// 2d array of items.
var darray = populate_array();
// take one item and fade out
opacity(darray[folioItemNum][2], 100, 0, 500);
// re-arrange.
// with time delay.
window.setTimeout(function (a,b,c,d,e){
var y = "<a href=\"" + c + "\" rel=\"lightbox[" + d + "]\" class=\"hiddenimg\"><img src=\"" + c + "\" class=\"folioimghidden\"/></a><a href=\"" + b + "\" rel=\"lightbox[" + d + "]\"><img src=\"" + b + "\" class=\"folioimg\"/></a>";
replace_html(e, y);
opacity(e, 0, 100, 500);
},500,document.getElementById(darray[folioItemNum][2]),darray[folioItemNum][ImageState],darray[folioItemNum][OldImageState],folioItemNum,darray[folioItemNum][2]);
// done.
}
function regenbottomimgs()
{
var isOpera, isIE = false;
if(typeof(window.opera) != 'undefined'){isOpera = true;}
if(!isOpera && navigator.userAgent.indexOf('Internet Explorer')){isIE = true;}
var array = Array(3);
array[0] = -1;
array[1] = -1;
array[2] = -1;
array[0] = get_unique_random_int(6, array, 3);
array[1] = get_unique_random_int(6, array, 3);
array[2] = get_unique_random_int(6, array, 3);
var darray = populate_array();
var imgstr = "<img src=\"" + darray[array[0]][1] + "\" class=\"scaleddown1\" /><img src=\"" + darray[array[1]][1] + "\" class=\"scaleddown2\" /><img src=\"" + darray[array[2]][1] + "\" class=\"scaleddown2\" />";
opacity("bottomimgs", 100, 0, 500);
window.setTimeout(function (a,b){
var x = replace_html(b, a);
opacity(b, 0, 100, 500);
},500,imgstr,"bottomimgs");
}
function get_random_int(Max)
{
var randomnumber = Math.round( Math.random() * Max );
return randomnumber;
}
function get_unique_random_int(Max, List, List_Length)
{
var stop = 1
var esc = 0
var x = 0;
var i = 0;
while ( stop == 1 )
{
esc = 0;
x = get_random_int(Max);
for ( i = 0; i < List_Length; i++ )
{
if ( x == List[i] )
{
esc = 1;
break;
}
}
if ( esc == 0 )
{
stop = 0;
}
}
return x;
}
function randomise_bottom_images()
{
regenbottomimgs();
setTimeout("randomise_bottom_images()",5000);
}
function launch_randomise()
{
setTimeout("randomise_bottom_images()", 5000);
}
function switchallnew()
{
switchimage(0,1);
switchimage(1,1);
switchimage(2,1);
switchimage(3,1);
switchimage(4,1);
switchimage(5,1);
switchimage(6,1);
switchimage(7,1);
}
function opacity(id, opacStart, opacEnd, millisec)
{
//speed for each frame
var speed = Math.round(millisec / 100);
var timer = 0;
//determine the direction for the blending, if start and end are the same nothing happens
if( opacStart > opacEnd )
{
for(i = opacStart; i >= opacEnd; i--) {
setTimeout(function (opacity, id) {
setStyleById(id, "opacity", (opacity / 100));
setStyleById(id, "MozOpacity", (opacity / 100));
setStyleById(id, "KhtmlOpacity", (opacity / 100));
setStyleById(id, "filter", "alpha(opacity=" + opacity + ")");
},(timer * speed), i, id);
timer++;
}
}
else if(opacStart < opacEnd)
{
for(i = opacStart; i <= opacEnd; i++)
{
setTimeout(function (opacity, id) {
setStyleById(id, "opacity", (opacity / 100));
setStyleById(id, "MozOpacity", (opacity / 100));
setStyleById(id, "KhtmlOpacity", (opacity / 100));
setStyleById(id, "filter", "alpha(opacity=" + opacity + ")");
},(timer * speed), i, id);
timer++;
}
}
}
Thanks, A. I have been working on a site for some time and only yesterday did something happen which wont upload these two images I replaced in my lightbox run through: here is the page: http://newghost.net/GRAPHICS.html The last image wont come up(just a white box) and the five image wont change to the new edited image. I made sure the text and images were all directly linked, the code was checked etc. All I did was replace the images, edited the images. One thing I did notice that was different was it says (run script) : ( Void) or something similar to that at the bottom left corner of the browser on all the images that are working but not on the last.--(??) Is there something I should do with this? its the only clue I have. I have been trying to get some fresher stuff up for a client I referred. Now I am afraid that they won't see the work... sigh...:/ I spent several hours yesterday trying to figure it out... but I wont give up. Is there a problem with my server? Is there some update that threw everything off? I am afraid to update anything more.... Any help would be greatly appreciated! Thanks! Hi I am trying to get javascript to update a database for me. The reason is I need to use JS and not ASP is because I need to update whenever a user clicks on a button and from what I am told ASP can not do this. I tried following an example, and this is what I came up with. However I get the errors Error: Object expected and Excptected Hexadecimal Digit. Here is the code Code: <script language=javascript>
function update()
{
var adoConn = new ActiveXObject("ADODB.Connection");
var adoRS = new ActiveXObject("ADODB.Recordset");
adoConn.Open("Provider=Microsoft.Jet.OLEDB.4.0;Data Source='\\data\user.mdb'");
adoRS.Open("Select * From ptotbl Where ID = 454");
adoRS.Edit;
adoRS.Fields("Delete").value = "True";
adoRS.Update;
adoRS.Close();
adoConn.Close();
}
Thanks I have a form that is working just fine the only thing is that I need to add a quantity field that will update the price. Can anyone help me with this please. I am not that good at javascript as you can see. I have gotten snippet from here and there to be able to create this form. Here is the code that I have at he moment: Code: <script type="text/javascript">
florida_tax_rate = .07;
function update_price(radio) {
price = parseFloat(radio.getAttribute("price"));
shipping = parseFloat(document.getElementById("shipping").innerHTML);
subtotal = document.getElementById("subtotal");
grand_total = document.getElementById("grand_total");
subtotal.innerHTML = price;
grand_total.innerHTML = (shipping + price).toFixed(2);
update_tax();
}
function update_tax() {
menu = document.getElementsByName("ShippingState")[0];
state = menu.value;
is_florida = state.match(/^(florida|fl)$/i);
price = parseFloat(document.getElementById("subtotal").innerHTML);
shipping = parseFloat(document.getElementById("shipping").innerHTML);
real_subtotal = price + shipping;
taxes = 0.00;
if (is_florida) {
taxes = real_subtotal * florida_tax_rate;
}
grand_total = document.getElementById("grand_total");
document.getElementById("taxes").innerHTML = taxes.toFixed(2);
grand_total.innerHTML = (real_subtotal + taxes).toFixed(2);
}
</script>
<form>
<input onchange="update_price(this);" type="radio" name="package" value="non-chamber" price="450.00" />
Non-Chamber Member (Qty: 0-5)<br />
<input name="non-chamber qty" type="text" id="non-chamber qty" value="" size="5" maxlength="999" />
Please Enter Your Quantity
<br />
<input onchange="update_price(this);" type="radio" name="package" value="chamber" price="425.00" />
Chamber Member (Qty: 0-5)<br />
<input name="chamber qty" type="text" id="chamber qty" value="" size="5" maxlength="999" />
Please Enter Your Quantity
<br />
<input onchange="update_price(this);" type="radio" name="package" value="standard" price="400.00" />
Bulk Orders (Qty: Over 5)<br />
<input name="bulk qty" type="text" id="bulk qty" value="" size="5" maxlength="999" />
Please Enter Your Quantity
<br />
<br /><br />
<div style="display:none;"><select onchange="update_tax();" name="ShippingState">
<option value="Florida" selected="selected">Florida</option>
</select></div>
<br />
Subtotal: $<span id="subtotal">0.00</span><br />
<div style="display:none;">Shipping: $<span id="shipping">0.00</span><br /></div>
Taxes: $<span id="taxes">0.00</span><br />
Grand Total: $<span id="grand_total">0.00</span><br />
<br />
<img src="http://www.paypal.com/en_US/i/btn/btn_paynowCC_LG.gif" onClick="document.paypalPayment.submit();" />
<input type="hidden" name="process" id="process" value="1" />
</form>
Thanks I've got a simple script that generates a button that sends to the printer when clicked. But a totally new thing to me is finding a way to update a "printed_unprinted" field in the database for that item. Anyone have experience with this? Right now, I just have: Code: <style type="text/css" media="print">
@page { size:8.5in 11in; margin: 1cm }
.printbutton {
visibility: hidden;
display: none;
}
</style>
<script>
document.write("<input type='button' " +
"onClick='window.print()' " +
"class='printbutton' " +
"value='Print This Page'/>");
</script>
I assume I could reference a php file? Just something quick like: PHP Code: <?php include("include/conn.php"); $id = mysql_escape_string($_POST['printed']); $query_update = "UPDATE tbl_registration SET reg_hardcopied = '1' WHERE reg_id = '$id'"; $dberror = ""; $ret = mysql_query($query_update); if(!$ret){} else{ //back to referrer } ?> Hello, I am having a little issue with creating an updating price script for my website. I tried to look at examples like those at Apple, Hp, Dell, and other sites that have the kind of script I am looking to create. The way I have my page is that it grabs data from my database when someone clicks my product, after that they go to the customize the product page. The price is supposed to change as they click and remove options. I just need a little help on where to start and how to update the price. I know Javascript is the coding but I have been struggling with it. Examples of the script can be found on the link below. There is also a snippet of my code I am working with.. Thanks in advance for some help. http://configure.us.dell.com/dellsto...en&s=dhs&cs=19 Code: <script type="text/javascript">
//<![CDATA[
window.onload = setupScripts;
function setupScripts()
{
var anOrder1 = new OrderForm();
}
//]]>
</script>
<form id="Options">
<div style="color:#F00"><?=$msg?></div>
<?php
if(is_array($_SESSION['cart'])){
$max=count($_SESSION['cart']);
for($i=0;$i<$max;$i++){
$pid=$_SESSION['cart'][$i]['productid'];
$pname=get_product_name($pid);
$price=get_price($pid);
$pdes=get_desc($pid);
$pdim=get_dimen($pid);
$pweight=get_weight($pid);
$pcode=get_code($pid);
$picture=get_pic($pid);
}
}
?>
<table width="850" border="0" cellpadding="8">
<tr>
<td width="50" align="left" colspan="2"><font color="#FF9933" size="+5" style="letter-spacing:20px;" ><?=$pname?></font><br />
<img src="<?=$picture?>" border="2" height="300" width="300"/>
</td>
<td width="275" align="left" colspan="2"><b>Description:</b> <font style="letter-spacing:4px; word-spacing:7px;"><?=$pdes?></font><br /><br />
<b>Product Code:</b> <font style="letter-spacing:4px; word-spacing:7px;"><?=$pcode?></font><br /><br />
<b>Dimensions:</b> <font style="letter-spacing:4px; word-spacing:7px;"><?=$pdim?></font><br /><br />
<b>Weight:</b> <font style="letter-spacing:4px; word-spacing:7px;"><?=$pweight?></font><br /><br />
<b>Price:</b> <big style="color:green">$</big><font style="letter-spacing:4px; word-spacing:7px;"><?=$price?></font><br /><br />
</td>
</tr>
<tr>
<td align="left" colspan="2"><img src="<?=$picture?>" border="2" height="50" width="50"/>
<img src="<?=$picture?>" border="2" height="50" width="50"/>
</td>
</tr>
<tr>
<td colspan="2" align="left"><font color="#FF9900" size="+4" style="letter-spacing:10px;">Fabric</font><hr color="#999999" size="5" width="400" align="left"/>
(Please describe the type of fabric you would like and we will try and match it. If you have a picture or link of a fabric style, please send along with item request.)
</td>
<td colspan="2" align="left"><font color="#FF9900" size="+4" style="letter-spacing:10px;">Handles</font><hr color="#999999" size="5" width="400" align="left"/>
(These handles are great for the children and adult type products)
</td>
</tr>
<tr>
<td colspan="2" align="left">
Check this box if you have your own fabric and would like to send to us.
<input name="own" type="checkbox" value="Own" id="chk0" /> <span id="txtPrice0">-5</span>
<input type="text" id="txtTotal" size="8" value="<?=$price?>"/>
<br />
Does anyone know of a photo gallery where the CLIENT is able to update both the images and the captions? Please and thank you. Or...... does anyone know of a gallery which pulls the photos and captions from a database? I can build a client interface to the database myself? Thanks again. Hi Community, I am running simple web cam streaming to html. Let me explain how it works: First C code grabs frame from web cam and PHP code send the image to the client where exists receiver php code. It saves the submitted image to disk and javascript updates image every 0.1 sec or less. it is working fine but there is blinking. So I changed Javascript to avoid blinking (changed to other script). In this case streaming is fine but after 2-5 sec it stops updating. here is script: <head> <title> Streaming</title> </head> <body> <!-- <img name="frame" src="" border="0" /> --> <img src="" id="webcam1" width="640" height="480" border="5" alt="Camera1"/> <script language="javascript"> document.images.webcam1.src = "http://my_IP_address/img.jpg"; document.images.webcam1.onload = Start; function LoadImage() { uniq1 = Math.random(); document.images.webcam1.src = "http://my_IP_address/img.jpg?"+uniq1; document.images.webcam1.alt = uniq1; } function Start() { setTimeout("LoadImage();", 70); } </script> </body> </html> Where is mistake? Why it stops updating after 2-5 seconds every time. Please help! Thank you |
|||||||