|
JavaScript - Dabase List Popup Picker
dear all....
could you help me how to created database popup picker with javascript and php....i use mysql databse. best regards Similar TutorialsHello, I really need your help with one. How can I use the following code below to save the date from my popup window datepicker back into a var and relay it back onto its parent page? I can't seem to figure this out: Code: <html>
<head>
<script>
function open_cal() {
var str_html = ""
+ "<!DOCTYPE html>\n"
+ "<html lang=\"en\">\n"
+ "<head>\n"
+ "<meta charset=\"utf-8\">\n"
+ "<title>CALENDAR</title>\n"
+ "<link href=\"jq/jquery-ui.css\" rel=\"stylesheet\" type=\"text/css\">\n"
+ "<script src=\"jq/jquery.min.js\" type=\"text/javascript\"></" + "script>\n"
+ "<script src=\"jq/jquery-ui.min.js\" type=\"text/javascript\"></" + "script>\n"
+ "<script src=\"jq/datepicker.js\" type=\"text/javascript\"></" + "script>\n"
+ "</head>\n"
+ "<body>\n"
+ "<div id=\"text\" style=\"font: bold 10pt Tahoma\">Enter Approval Date:</div>\n"
+ "<div id=\"datepicker\"></div>\n"
+ "</body>\n"
+ "</html>"
var j = window.open("","CALENDAR","width=200,height=250,status=no,resizable=yes,top=200,left=200")
j.opener = self;
j.document.write(str_html);
}
</script>
</head>
<body>
<input onclick="open_cal()" type="button" value="Open" name="B1">
</body>
</html>
Datepicker.js: Code: $(function() {
$( "#datepicker" ).datepicker({
dateFormat: 'dd/mm/yy',
onSelect: function(dateText, inst) {
alert(dateText)
window.close()
}
})
});
Any help with this is greatly and mostly appreciated. Thanks in advance, Cheers, J Hello Folks, Here is my dropdown menu: Code: <select name="peeps"> <option value="Frank Tompson">Frank Tompson</option> <option value="Henry Wilson">Henry Wilson</option> <option value="Bill Kent">Bill Kent</option> <option value="Jessi McDonald"> Jessi McDonald</option> <option value="John Hays">John Hays</option> How can i make it so if i click on John Hays a JavaScript pop up will say Hello John Hays, and if i click on Bill Kent a popup will say hello Bill Kent and if i click on any other name nothing happens? I'm looking for a good javascript time & date popup other than this one. It conflicts with Joomlas javascript code and causes problems in the back-end. Other than that, it's perfect. Does anyone know of any other free calendar popups that let you pick both date and time? Hi, I'm new to javascripts. I have a perl script that takes 2 sets of dates as input: http://myhost/perlscript.pl/?startda...ate=yyyy-mm-dd I would like to have a date picker for the 2 arguments and pass them as yyyy-mm-dd format . thanks, Sirjune Hi all , first let me just say I know incredibly little about JavaScript at all , I'm currently studying PHP however as part of a course and do occasionally use JavaScript here and there My problem is on a register page for example i have a JavaScript Date picker so users can select their D.O.B without me having to worry about if the date is valid ...etc through PHP checking. PHP Code: <tr> <th>Date of Birth :</th> <td input name="dob" id="dob"><?php $thisyear= getdate(); $myCalendar = new tc_calendar("date5", true, false); $myCalendar->setIcon("./images/iconCalendar.gif"); $myCalendar->setDate($thisyear['year'],$thisyear['month'],$thisyear['day']); $myCalendar->setPath("./"); $myCalendar->setYearInterval(1910, ($thisyear['year'])); $myCalendar->dateAllow('1910-05-13', ($thisyear['year']-18) ); $myCalendar->setDateFormat('j F Y'); //$myCalendar->setHeight(350); //$myCalendar->autoSubmit(true, "form1"); $myCalendar->writeScript(); ?></td> </tr> Now in the <head> tag of my page i do i my JavaScript validation , and was wondering what would i have to do for this to work Thus far i've tried .checked/.selected basically anything i can think of but since its not my forte there isn't a lot for me to think of PHP Code: <script type="text/javascript"> function validate(form) { if(!document.form1.agree.checked) { alert("Please check the terms and conditions"); return false; } if(!document.form1.dob.checked) { alert("Please select a date of birth"); return false; } return true; } </script> </script> Now i was wondering is there anyway to check if a valid date was selected ?? if you can offer any help it'd be much appreciated. Good day! I explore something so I used jquery in my date, without any knowledge about jquery. I research a sample Jquery Date Picker internet and I found one, my problem is the Year is started at 2001 , I don't know if I could change it so that the year would start atleast 1950's or 1990's here's the code that I add in my webpage to display the Jquery Date Picker Code: <link rel="stylesheet" href="ui.all.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#date").datepicker({ showOn: 'button', buttonText: "Select your Birthday" });
});
</script>
I will attach the date picker that I get from internet. Thank you Hi to aLL CAN ANY BODY HELP ME OUT IN WRITING JAVASCRIPT CODE FOR MONTH PICKER HERE I DONT NEED DATE, I JUST WANT ALL THE MONTHS IN PLACE OF DATES AND AN OPTION FOR SELECTING YEARS, WHEN I SELECT MONTH AND CHOOSE YEAR, THEN TEXT FIELD GET JAN-2008 clearly, need a calender with out date in it, months and years.... colud you please give me any information regarding this thank you hi folks.. how to start with color picker using a layered div? i would like to have idea about that.. if anyone have any code samples then let me know.. thank you I have been working on this picker calendar all day and I am completely stumped. The calendar will show. Any help with this code would be REALLY appreciated!! Thank you!! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Central Valley Snowboarding</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" href="js_styles.css" type="text/css" /> </head> <body> <h1>Central Valley Snowboarding</h1> <h2>Group Reservations</h2><hr /> <form action="FormProcessor.html" method="get" enctype="application/x-www-form-urlencoded"> <h3>Snowboarding Date</h3> <p><input type="text" name="reservationDate" /> <a href="" onclick="displayCalendar()">Select Date</a></p> <h3>Group Leader</h3> <table border="0"> <tr valign="top"> <td>Last name<br /> <input type="text" name="leaderLastName" size="50" /> <br /> First name<br /> <input type="text" name="leaderFirstName" size="50" /> <br /> Telephone<br /> <input type="text" name="leaderTelephone" size="50" /> <br /> Address<br /> <input type="text" name="leaderAddress" size="50" /><br /> City, State, Zip<br /> <input type="text" name="leaderCity" size="34" /> <input type="text" name="leaderState" size="2" maxlength="2" /> <input type="text" name="leaderZip" size="5" maxlength="5" /></td> </tr></table> <script type="text/javascript"> /* <![CDATA[ */ var dateObject = new Date(); var month = dateObject.getMonth(); var monthArray = new Array("January","February","March","April","May","June", "July","August","September","October","November","December"); var dateToday = monthArray[month] + " " + dateObject.getDate() + ", " + dateObject.getFullYear(); document.forms[0].reservationDate.value = dateToday; function displayCalendar(whichMonth) { calendarWin = window.open("", "CalWindow", "status=no,resizable=yes,width=400,height=320,left=200, top=200"); calendarWin.focus(); calendarWin.document.write("<!DOCTYPE html PUBLIC '-//W3C// DTD XHTML 1.0 Strict//EN' 'http://www.w3.org/TR/xhtml1/ DTD/xhtml1-strict.dtd'><html xmlns='http://www.w3.org/ 1999/xhtml'> <head><title>Central Valley Snowboarding</title><meta http-equiv='content-type' content='text/html; charset=iso-8859-1' /> <link rel='stylesheet' href='js_styles.css' type='text/ css' /></head><body>"); calendarWin.document.write("<table cellspacing='0' border='1' width='100%'>"); } if (whichMonth == -1) dateObject.setMonth(dateObject.getMonth()-1); else if (whichMonth == 1) dateObject.setMonth(dateObject.getMonth()+1); var month = dateObject.getMonth(); calendarWin.document.write("<tr><td colspan='2'><a href='' onclick='self.opener.displayCalendar(-1);return false'> Previous</a></td><td colspan='3' align='center'><strong>" + monthArray[month] + " " + dateObject.getFullYear() + "</strong></td><td colspan='2' align='right'><a href='' onclick='self.opener.displayCalendar(1);return false'> Next</a></td></tr>"); + "</strong></td></td></tr>"); calendarWin.document.write("<tr align='center'><td>Sun</td> <td>Mon</td><td>Tue</td><td>Wed</td><td>Thu</td><td>Fri</td> <td>Sat</td></tr>"); calendarWin.document.write("<tr align='center'>"); dateObject.setDate(1); var dayOfWeek = dateObject.getDay(); for (var i=0; i<dayOfWeek; ++i) { calendarWin.document.write("<td> </td>"); } var daysWithDates = 7 - dayOfWeek; var dateCounter = 1; for(var i=0; i<daysWithDates; ++i) { var curDate = monthArray[month] + " " + dateCounter + ", " + dateObject.getFullYear(); calendarWin.document.write("<td><a href='' onclick='self.opener.document.forms[0] .reservationDate.value=\"" + curDate + "\";self.close()'>" + dateCounter + "</a></td>"); ++dateCounter; } var numDays = 0; // January, March, May, July, August, October, December if (month == 0 || month == 2 || month == 4 || month == 6 || month == 7 || month == 9 || month == 11) numDays = 31; // February else if (month == 1) numDays = 28; // April, June, September, November else if (month == 3 || month == 5 || month == 8 || month == 10) numDays = 30; for (var rowCounter = 0; rowCounter < 5; ++rowCounter) { var weekDayCounter = 0; calendarWin.document.write("<tr align='center'>"); while (weekDayCounter < 7) { var curDate = monthArray[month] + " " + dateCounter + ", " + dateObject.getFullYear(); if (dateCounter <= numDays) calendarWin.document.write("<td><a href='' onclick='self.opener.document.forms[0]. reservationDate.value=\"" + curDate + "\";self.close()'>" + dateCounter + "</a></td>"); else calendarWin.document.write("<td> </td>"); ++weekDayCounter; ++dateCounter; } calendarWin.document.write("</tr>"); } calendarWin.document.write("</table></body></html>"); calendarWin.document.close(); /* ]]> */ </script> <p><input type="submit" value="Submit Group Reservation" /></p> </form> </body> </html> I have an issue with a javascript date picker. I need to figure out how to get the date to submit from the date picker into my database. Haven't been able to get any help from the maker of the date picker. I have a form which is collecting about 15 other items and I need the date to go in as well. Any help would be great.
I would appreciate if anyone could guide my point by point on how one could create a category picker just like gumtree (preferably in jquery): http://www.gumtree.com/add_posting.html?location_id=uk Specifically the points How clicking on a category opens another to the right How clicking on a category appends a variable like "#cat-10201" into the url (and vice versa) How css lists are used instead of form select menus (making it easily styled) How clicking on a deep subcategory automatically preselects all parent categories I'm not looking for anyone to actually code it for me (that would be outrageous ) but tips on how it's actually structured and steps on how it can be coded would be highly appreciated. I can do PHP and I know CSS also. I don't know plain javascript but I'm sure I can do most of it in jQuery Hi, I'm trying to display a time clock in input text box. The time should display in Time utilization box after clicking on START BUTTON. I tried the below code and it is not starting the time. However, I tried the javascript individually and it worked. Any help? PHP Code: <script type="text/javascript"> var seconds = 0; var minutes = 0; var hours = 0; function zeroPad(time) { var numZeropad = time + ''; while(numZeropad.length < 2) { numZeropad = "0" + numZeropad; } return numZeropad; } function countSecs() { seconds++; if (seconds > 59) { minutes++; seconds = 0; } if (minutes > 59) { hours++ minutes = 0; } document.getElementById("time_utilization").innerHTML = zeroPad(hours) + ":" + zeroPad(minutes) + ":" + zeroPad(seconds); } function startTimer() { action = window.setInterval(countSecs,1000); } </script> </head> <body> <?php include("header.php"); ?> <div class="art-content-layout"> <div class="art-content-layout-row"> <div class="art-layout-cell art-content"> <div class="art-post"> <div class="art-post-body"> <div class="art-post-inner art-article"> <form name="tracker" method="post" action="processor.php" onsubmit="return formCheck(this);"> <ul> <li class="mainForm" id="fieldBox_8"> <label class="formFieldQuestion">Start Time *</label><input readonly class=mainForm type=text name=start_time id=start_time size='30' value=''> <input type="button" id="start1_time" style="width: 100px" Value="Start Time" onClick="startTimer()"></li> <li class="mainForm" id="fieldBox_12"> <label class="formFieldQuestion">Time Utilization</label><input class=mainForm type=text name="time_utilization" id="time_utilization" size='8' value='00:00:00' ></li> <br /> <br /> <li class="mainForm"> <input id="saveForm" class="mainForm" type="submit" value="Submit" style="width : 100px"/> </li> </form> I am getting "Unknown Runtime Error at line 43". However, code has below line at link 43: Code: document.getElementById("time_utilization").innerHTML = zeroPad(hours) + ":" + zeroPad(minutes) + ":" + zeroPad(seconds);
Hi All, i am having some difficulties to figure out how can i link get my calendar (datepicker) working with my dynamic generated textbox . I am using a Jquery file that i download form the net <!-- link calendar files --> <script language="JavaScript" src="calendar_us.js"></script> <link rel="stylesheet" href="calendar.css"> and here is my code to generate my dynamic controls which is working fine actually..i need to have : 1- option : the datepicker showing up once i click on StartDate textbox 2- in the future i ll use an img and i want to use it to populate the datepicker. below is my modest javascipt code i use to create dynamic textbox: <script type="text/javascript"> // Declare element id for different dynamic generated controls var elementid = 1; function addNew() { var elementrow = 1; // Get the main Div in which all the other divs will be added var mainContainer = document.getElementById('mainContainer'); // Create a new div for holding text and button input elements var newDiv = document.createElement('div'); var bgc ="##E2E2E2"; //"##b2d47e"; newStartDate = document.createElement( 'INPUT' ); newStartDate.id = 'id' + elementid + elementrow; newStartDate.setAttribute('id1','id'+ elementid+elementrow); newStartDate.setAttribute('name','StartDateName'+ elementid+elementrow); newStartDate.size=8; newStartDate.style.backgroundColor= bgc; // Create buttons for creating and removing inputs var newAddButton = document.createElement('input'); newAddButton.type = "button"; newAddButton.value = " + "; newAddButton.title = " Add new Project"; var newDelButton = document.createElement('input'); newDelButton.type = "button"; newDelButton.value = " - "; newDelButton.title = " Remove Project"; // Append new text input to the newDiv newDiv.appendChild(newStartDate); // Append new button inputs to the newDiv newDiv.appendChild(newAddButton); newDiv.appendChild(newDelButton); // Append newDiv input to the mainContainer div mainContainer.appendChild(newDiv); // Add a handler to button for deleting the newDiv from the mainContainer newAddButton.onclick = addNew; newDelButton.onclick = function() {mainContainer.removeChild(newDiv);}; elementid++; } </script> any help will be apprecited ! thanks I have been researching like crazy, and I can't find any information that seems to fit what I need! I am looking for a solution for the following problem: We have products that have multiple parts that can be colored separately from each other. In other words, if it was a shirt, the sleeves, graphic, front panel, pocket, and back panel could all be a different color. We have a range of color options available that can be up to 50. So, if I made a single image for each combination, we're looking at thousands of images here. How can I use scripts to build a page that can pick all of these options and combine them together in a product image for the customer? Is it even possible? I have tried layering 4 0r 5 images with relative and absolute positioning, and doing an image swap...but that is not something I can see us using on a regular basis. I must be missing something here. We've been looking around at other sites like Victorias Secret and Old Navy, and like their color changes....but theirs seem to only involve the single color layer. Thanks for any advice! does anyone know of a timepicker that i can disable weekends and bank holidays (or that at least easily has a place i can add code to disable days by making a call to my database of holidays in ajax?) Hi, I'm kinda hoping this is possible but haven't found any reference to it... I have a parent page that opens a popup on click that launches a sidebar navigation on the right of the screen and resizes the parent page. What I am wanting to do is create a second popup (approx 250px high) that opens below the navigation (which is only around 600px high) but I have noticed that even when you have no status bar in the popup windows, they can still end up overlapping because of additional tools or plugins that the viewer has in their browser. Is there any way to get the popups to butt up against each other instead of overlapping? More like a relative popup? Any assistance would be appreciated. :-) Hi. I'm working on a script that picks out a random entry in an array every 10seconds and show it to the user (using document.write). So far I've got the "Randomizer" to work like this: Code: function random(){
var nummer = Math.floor(Math.random()* tekst.length);
return nummer;
}
var tekst = new Array("Different", "Values");
and showing it like this: Code: document.write(tekst[random()]); Now, I've tried my best to implement setInterval() to give me a new random number every 10seconds, but so far without any luck... I appreciate all help! Thx in advance. Hi all, I have been struggling on a bit of code for a while now. I need to populate a second drop down list (Region) based upon the selection of the first (County). I have found a piece of code that works on its own and have adapted to suit my needs - see below. However, when I drop it into my main page the javascript is not working. It's because of the formObject but I just don't know enough to resolve this! Furthermore, I need the textboxes the user has already completed in the form to retain their value once the javascript kicks in as the completed form will submit to a database. This piece of code is working well . . . . Code: <?php
$link = mysql_connect('myhost', 'myusername', 'mypassword') or die('Could not connect: ' . mysql_error());
mysql_select_db('mydatabase') or die('Could not select database');
if(isset($_GET["County"]) && is_numeric($_GET["County"]))
{
$County = $_GET["County"];
}
if(isset($_GET["Region"]) && is_numeric($_GET["Region"]))
{
$Region = $_GET["Region"];
}
?>
<script language="JavaScript">
function autoSubmit()
{
var formObject = document.forms['theForm'];
formObject.submit();
}
</script>
<form name="theForm" method="get">
<!-- County SELECTION BASED ON city VALUE -->
<?php
?>
<select name="County" onChange="autoSubmit();">
<option value=''</option>
<?php
//POPULATE DROP DOWN MENU WITH COUNTRIES FROM A GIVEN city
$sql = "SELECT * FROM county_regions";
$counties = mysql_query($sql,$link);
while($row = mysql_fetch_array($counties))
{
echo ("<option value=\"$row[CountyID]\" " . ($County == $row["CountyID"]? " selected" : "") . ">$row[County]</option>");
}
?>
</select>
<?php
?>
<br><br>
<?php
if($County!= null && is_numeric($County))
{
?>
<select name="Region" onChange="autoSubmit();">
<?php
//POPULATE DROP DOWN MENU WITH RegionS FROM A GIVEN city, County
$sql = "SELECT * FROM county_regions WHERE CountyID = $County ";
$Regions = mysql_query($sql,$link);
while($row = mysql_fetch_array($Regions))
{
echo ("<option value=\"$row[CountyID]\" " . ($Region == $row["CountyID"]? " selected" : "") . ">$row[Region]</option>");
}
?>
</select>
<?php
}
?>
What follows is my form where the javascript is not working - edited quite a bit to save on space! Code:
<head>
<script language="JavaScript">
function autoSubmit()
{
var formObject = document.forms['subform'];
formObject.submit();
}
</script>
</head>
<form enctype="multipart/form-data" method="post" action="add_attraction01.php" FORM NAME="FormName">
<input type="hidden" name="MAX_FILE_SIZE" value="32768" />
<label for="Business_name">Business Name</label>
<input type="text" size="60" STYLE="color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12px; background-color: #72A4D2;"
<id="Business_name" name="Business_name" maxlength=60/><font size="1" face="arial" color="red">Required field</font><br />
<label for="StreetAddress">Address</label>
<input type="text" size="60" rows="2" id="StreetAddress" name="StreetAddress" maxlength=120/><font size="1" face="arial" color="red">Required field</font><br />
<label for="Town">Town</label> <input type="text" size="25" id="Town" name="Town" maxlength=25/><font size="1" face="arial" color="red">Required field</font><br />
<?php
$link = mysql_connect('myhost', 'myusername', 'mypassword') or die('Could not connect: ' . mysql_error());
mysql_select_db('mydatabase') or die('Could not select database');
if(isset($_GET["County"]) && is_numeric($_GET["County"]))
{
$County = $_GET["County"];
}
if(isset($_GET["Region"]) && is_numeric($_GET["Region"]))
{
$Region = $_GET["Region"];
}
?>
<form name = "subform" method="get">
<select name="County" onChange="autoSubmit();">
<option value=''</option>
<?php
$sql = "SELECT * FROM county_regions";
$counties = mysql_query($sql,$link);
while($row = mysql_fetch_array($counties))
{
echo ("<option value=\"$row[CountyID]\" " . ($County == $row["CountyID"]? " selected" : "") . ">$row[County]</option>");
}
?>
</select>
<?php
?>
<br><br>
<?php
if($County!= null && is_numeric($County))
{
?>
<select name="Region" onChange="autoSubmit();">
<?php
$sql = "SELECT * FROM county_regions WHERE CountyID = $County ";
$Regions = mysql_query($sql,$link);
while($row = mysql_fetch_array($Regions))
{
echo ("<option value=\"$row[CountyID]\" " . ($Region == $row["CountyID"]? " selected" : "") . ">$row[Region]</option>");
}
?>
</select>
<?php
}
?>
<input type="text" size="20"id="Tel_No" name="Tel_No" maxlength=20 onkeypress="return isNumberKey(event)"/><font size="1" face="arial" color="red">Required field</font><br />
<br/>
<input type="submit" value="Submit your attraction" name="submit" onclick="return BothFieldsIdenticalCaseSensitive();"/>
</form>
</body>
</html>
It's probably obvious to you guys!! Thanks in advance for your help. I would like to make an ordered list, for example: 1. Airplane 2. Boat 3. Car I'd like one of the words to be displayed on my webpage, for example: Boat Then I'd want an up button, and a down button. The up button would display Airplane instead of Boat, and the down button would display Car instead of Boat. Once it got to Car, the same up button would change it back to boat. How do I do this? Thanks. |
|||||||