Search the Community

$('.cart_item').hover(function(){ $('.remove_cart_item').fadeToggle(); }); So the issue is that when I hover over the div class cart_item, all the divs with class cart_item show the hidden div class remove_cart_item. How do I get it to just show for the div its hovering over?

Here is a snippet of the code for an assignment for my web programming class. I have to use PHP and JQuery to read a delimited text file and display the products in one row of a table. I have to use JQuery's toggle function to be able to show/hide details (price, image, and name) of a few products. Everything seemed to work until I started entering the JQuery code in the division. I have to use $productId as the id for the <div> and I seem to be having some trouble passing the variables to JQuery. I would appreciate any help anyone could offer as I'm at an impasse. I've attached a screenshot of the desired outcome. Thank you. echo "<h3>OUR PRODUCTS</h3>"; echo "<form name=\"shoppingCart\" action=\"checkOut.php\" method=\"post\"> <input type=\"button\" value=\"CHECK OUT\" onclick=\"document.shoppingCart.submit()\"> <input type=\"button\" value=\"MAIN MENU\" onclick=\"location='/'\"> <!--For aesthetic purposes only--> <button type=\"button\">INSTRUCTIONS</button> </form>"; echo "<p>Click a product name for details and to order it. After selecting products click CHECK OUT.</p>"; echo "<table>"; echo "<tr>";// open data file in read only mode $productsData = fopen("products.txt","r");// parse file in while loop and generate product info while(!feof($productsData)) { $row=fgets($productsData); $row=trim($row); $productArray = explode("^",$row); $productId = $productArray[0]; $productName = $productArray[1]; $productPrice = $productArray[2]; $productImageUrl = $productArray[3]; echo "<td width=\"220\" valign='top'>"; echo "<span style=\"font-weight: bold; font-size: 20px;\" onclick=\"$('#$productId').animate({height: 'toggle'}, 'slow' );\">$productName</span>"; echo "</td>"; echo "<td valign='top'> <div id=\"<?php echo($productId); ?>\" style=\"padding: 10px; display: none; font-weight: bold;\"> <img style=\"width: 200px;\" src=\"<?php echo($productImageUrl); ?>\"> <br> Send me: <select name=\"<?php echo($productId); ?>\"> <option value=\"0\">None</option> <option value=\"1\">1</option> <option value=\"2\">2</option> <option value=\"3\">3</option> </select> </div>"; echo "</td>"; };// close data file fclose($productsData);echo "</tr>"; echo "</table>";

I have been trying to create a rollover effect that enlarges a div in the results page. Identical to the old google image results, when you rollover an image it would enlarge. I am currently doing this through jquery animate $('.product_result').hover(function(){ $(this).css('position', 'relative') $(this).animate({ 'width': '220px', 'height': '286px', 'margin-left': '-6px', 'margin-top': '-6px' }, 'fast'); },function(){ $(this).animate({ 'width': '200px', 'height': '260px', 'margin-left': '6px', 'margin-top': '6px' }, 'fast'); }); The problem is with this code is that it distorts the position of all other elements I want it to do the equivalent effect of being position absolute, when the height and width are increased, as to not affect layouts.

There are a lot of solutions out there as to how to save the position of draggable DIVs but I haven't found any that will help with using a While loop in php. I have a database of "needs" and I want to display all the "needs" that match the persons username and status=inprogress. This could be 1 need or 1,000,000 needs depending on if the criteria is met. I want to save the position of the need (DIV) automatically when it's moved. Is this possible? Here the code I currently have that displays the "needs" (divs) <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" /> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css" /> <style> #set div { width: 90px; height: 90px; padding: 0.5em; float: left; margin: 0 10px 10px 0; } #set { clear:both; float:left; width: 368px; height: 120px; } p { clear:both; margin:0; padding:1em 0; } </style> <script> $(function() { $( "#set div" ).draggable({ stack: "#set div" }); }); </script>

Hi there I have the following page, which includes a php mail function and sends a few of the fields via email successfully. Once the form is submitted, another page is displayed called 'Thank you'. (?page_id=2561) Question 1: Is there a way to reference all of the fields from the html tables at once in the php script (to email all the fields) or is it necessary to call each fields as I have done with 'companyName' etc? Question 2: How would I include all of the fields 'submitted contents' to display on the 'Thank you' page (?page_id=2561) - as I would like to add a 'print to pdf' button on this page, whereby the user can print the submitted form contents. I would greatly appreciate any advice / direction :) Thank you so much <?php { //send email $email = $_REQUEST['email'] ; $confName = $_REQUEST['conferenceName'] ; $companyName = $_REQUEST['companyName'] ; mail("myemail@yahoo.com", $confName, $companyName, "From:" . $email); } ?> <form method="post" id="quote" action="?page_id=2561"> <script type="text/javascript">// <![CDATA[ jQuery('#quote').keyup(function (){ doTotal(this); calcMenu(this); }); // ]]></script> <table id="table1" border="0" cellspacing="3" cellpadding="3"> <tbody> <tr> <td>Enquiry Date</td> <td> <div align="center"><input type="text" name="dateToday" size="25" /></div></td> </tr> <tr> <td>Conference Name</td> <td> <div align="center"><input type="text" name="conferenceName" size="25" /></div></td> </tr> <tr> <td>Company Name</td> <td> <div align="center"><input type="text" name="companyName" size="25" /></div></td> </tr> <tr> <td>Special Requests</td> <td><textarea name="comment" rows="5" cols="26"></textarea></td> </tr> </tbody> </table> <table id="table2" border="0" cellspacing="3" cellpadding="3"> <tbody> <tr> <td>First Name</td> <td> <div align="center"><input type="text" name="firstName" size="25" /></div></td> </tr> <tr> <td>Last Name</td> <td> <div align="center"><input type="text" name="lastName" size="25" /></div></td> </tr> <tr> <td>Tel No</td> <td> <div align="center"><input type="text" name="telNo" size="25" /></div></td> </tr> <tr> <td>Cell</td> <td> <div align="center"><input type="text" name="cellNo" size="25" /></div></td> </tr> <tr> <td>Email</td> <td> <div align="center"><input type="text" name="email" size="25" /></div></td> </tr> <tr> <td><input onclick="formReset()" type="button" value="Reset form" /></td> </tr> <tr> <td><input type='submit'></td> </tr> </tbody> </table> <table id="tablex" border="1" cellspacing="3" cellpadding="3"> <tbody> <tr> <th scope="col" width="30"> <div align="center">Date</div></th> <th scope="col" width="128"> <div align="center">Amount of Delegates ½ Day Conference @ R 240 pp</div></th> <th width="112"> <div align="center">Amount of Delegates Full Day Conference @ R 260 pp</div></th> <th width="112"> <div align="center">Menu No</div></th> <th width="112"> <div align="center">Price pp for Menu (1-7: R70, 8-10 R85, 11: R105, 12: R85)</div></th> <th width="112"> <div align="center">Total Persons for meals</div></th> <th width="112"> <div align="center">Amount of Single Rooms @ R 480 pp</div></th> <th width="112"> <div align="center">Amount of Double Rooms @ R 720 pp</div></th> <th width="134"> <div align="center">Total for the day</div></th> </tr> <tr> <td> <div align="center"><input type="text" name="date1" size="10" /></div></td> <td> <div align="center"><input type="text" name="halfday1" size="5" maxlength="10" /></div></td> <td> <div align="center"><input type="text" name="fullday1" size="5" /></div></td> <td> <div align="center"><input type="text" name="MenuNo1" size="5" /></div></td> <td> <div align="center"><input type="text" name="MenuPrice1" size="5" /></div></td> <td> <div align="center"><input type="text" name="MealPersons1" size="5" /></div></td> <td> <div align="center"><input type="text" name="SingleRooms1" size="5" /></div></td> <td> <div align="center"><input type="text" name="DoubleRooms1" size="5" /></div></td> <td> <div align="center"><input type="text" name="total1" size="5" /></div></td> </tr> <tr> <td> <div align="center"><input type="text" name="date2" size="10" /></div></td> <td> <div align="center"><input type="text" name="halfday2" size="5" /></div></td> <td> <div align="center"><input type="text" name="fullday2" size="5" /></div></td> <td> <div align="center"><input type="text" name="MenuNo2" size="5" /></div></td> <td> <div align="center"><input type="text" name="MenuPrice2" size="5" /></div></td> <td> <div align="center"><input type="text" name="MealPersons2" size="5" /></div></td> <td> <div align="center"><input type="text" name="SingleRooms2" size="5" /></div></td> <td> <div align="center"><input type="text" name="DoubleRooms2" size="5" /></div></td> <td> <div align="center"><input type="text" name="total2" size="5" /></div></td> </tr> <tr> <td> <div align="center"><input type="text" name="date3" size="10" /></div></td> <td> <div align="center"><input type="text" name="halfday3" size="5" /></div></td> <td> <div align="center"><input type="text" name="fullday3" size="5" /></div></td> <td> <div align="center"><input type="text" name="MenuNo3" size="5" /></div></td> <td> <div align="center"><input type="text" name="MenuPrice3" size="5" /></div></td> <td> <div align="center"><input type="text" name="MealPersons3" size="5" /></div></td> <td> <div align="center"><input type="text" name="SingleRooms3" size="5" /></div></td> <td> <div align="center"><input type="text" name="DoubleRooms3" size="5" /></div></td> <td> <div align="center"><input type="text" name="total3" size="5" /></div></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> </tbody> </table> </form>

Good day, I've got a problem getting the value of the parameter on a function I've got this code to append on my div $(' .'+type).append(' <a href="#" id="'+type+'-'+desId+'" class="admin-managers"> <span class="admin-managers" id="'+name+'">'+name+'</span> <span id="'+desId+'" onclick="remove('+type+','+desId+')" class="remove" name="<?php echo $type; ?>"></span></a> '); that is how I append the data and it is working fine, But on the "remove(type,desId)" function on: function remove(type,id){ Alert(type); } the id is working fine, but on the type everytime I alert it it return "javascript:void(0)"> What is that happening,? ?

Hi there, i'm busy with a project but know im stuck at some point. What i want to do is, when someone presses the home button it changes his color. How I wanted to do is swap from image 1 (white) to image 2 (blue). So the person can see on which page he/she is. But when i put this code into the website, it wont show nothing. When i press 2 times it will show the blue image. And when i press many times you see the white and blue image swapping. But it won't stand on the white image, only on the blue image Here is the code i use. --> <a href='' "<?php echo $this->createUrl("/admin/survey/sa/index"); ?>" onclick="edit()"><img id="img1" onclick="imageChange(this)"'<?php echo $sImageURL;?>home.png' alt='<?php $clang->eT("Default administration page");?>' /> <script type="text/javascript"> { var img1 = "/LimeSurvey/styles/scanyours/images/home.png"; var img2 = "/LimeSurvey/styles/scanyours/images/home1.png"; } { var imageChoice = 1; } function imageChange(element) { if (imageChoice == 1) { element.src = img2; imageChoice = 2; } else if (imageChoice == 2) { element.src = img1; imageChoice = 1; } } </script></a>

I am a newbee in php, jquery and ajax. I have a code in jquery to add and remove the textboxes dynamically on button click. I want to post the values of dynamically created textbox values to next page and display those values on action page as well as insert them into db. Any help is much appreciated. Thanks in advance. Please click on the link to see how the textboxes are dynamically created. http://jsfiddle.net/NSePb/1/ I have uploaded the two pages. I want to post the data from quotations.phpquotations.php to quot_rec.php and display the posted values on quot_rec.phpquot_rec.php

I have a form that has 2 dropdown lists (Diplomas, Fields), a submit button and an "Add" button that copies the selected values of the dropdownlists to some dynamically generated textboxes as long as the number of the textboxes is lower than 5 This is the code of the dipSecSelection.php file included inside the form: <!----------- The dipSecSelection File -------------> <div id="dipSecSelection"> <table> <tr> <td><label for="diplomes">Diplome:</label></td> <td> <select name="Diplomes" id="Diplomes"> <option value="na">--Diplome--</option> <option value="Technician">Technician</option> <option value="Master">Master</option> <option value="PhD">PhD</option> </select> </td> <td id="separator">|</td><!-- Separator --> <td><label for="secteurs">Secteur:</label></td> <td> <select name="Secteurs" id="Secteurs"> <option value="na">--Secteur--</option> <option value="Software Dev">Software Dev</option> <option value="Engineering">Engineering</option> <option value="Physics">Physics</option> </select> </td> <td> <a href="#" Onclick="addDipSec()" value="Add" class="button">Add</a> </td> </tr> </table> <table> <tr> <td><div id='DipTextBoxesGroup'></div></td> <td><div id='SecTextBoxesGroup'></div></td> </tr> </table> </div> <script type="text/javascript"> //Diplomas textBoxes!!! var counterdip = 1; var countersec = 1; function addDipSec(){ if(counter>5){ alert("Only 5 Diplomas allow"); return false; } var newTextBoxDiv = $(document.createElement('div')).attr("id", 'TextBoxDiv' + counterdip); newTextBoxDiv.after().html('<label>Diplome #'+ counterdip + ' : </label>' + '<input type="text" name="dipBox[]" id="textboxdip' + counterdip + '" value="" >'); newTextBoxDiv.appendTo("#DipTextBoxesGroup"); $('#textboxdip'+counterdip).val($('#Diplomes option:selected').html()); counter++; //Secteurs textBoxes if(countersec>5){ alert("Only 5 Setors are allowed"); return false; } var newTextBoxDiv = $(document.createElement('div')).attr("id", 'TextBoxDiv' + countersec); newTextBoxDiv.after().html('<label>Secteur #'+ countersec + ' : </label>' + '<input type="text" name="secBox[]" id="textboxsec' + countersec + '" value="" size="35">'); newTextBoxDiv.appendTo("#SecTextBoxesGroup"); $('#textboxsec'+countersec).val($('#Secteurs option:selected').html()); countersec++; alert(secBox[0].val); } </script> This is the php code: <form action="<?php echo $_SERVER['REQUEST_URI']; ?>" method="POST" enctype="multipart/form-data"> <?php include'includes/dipSecSelection.php'?> <?php if(isset($_POST['dipBox']) && isset($_POST['secBox'])){ if(!empty($_POST['dipBox'])&&!empty($_POST['secBox'])){ $dip= $_POST['dipBox']; $sec= $_POST['secBox']; $N = count($dip); for($i=0; $i < $N; $i++){ $add_AnnDipSec = "INSERT INTO annDipSec VALUES('$dip[$i]','$sec[$i]')"; if(mysqli_query($connection, $add_AnnDipSec)){ echo'Successfully Added to AnnDipSec'; }else{echo'Error while trying to insert into AnnDipSec';} } }else{echo"Dip and Sec were Empty";} } ?> <input type="submit" name="submit" value="Submit" class='button'> </form> Problem is that dipBox[] and secBox[] never get set and always return nothing so they never get inserted to the database table.

Dear members, I m running with the following problem for more than a week but i m not able to sort out. The scenario is that, in one of my php form i m having two dropdown and a text box related to each other. i.e when i select a product from dropdown1, the values of dropdown2 will be sorted based on the value of dropdown1 and similarly based on the value of dropdown2 , the value of textbox will be shown. This i accomplished with the help of ajax and jquery. And also this one working for me very well(shown in the image 1&2 of attachements). But the issue now is, in my product selection, my product list went very long so i had to bring an auto-suggestion. i brought the jquery selection with auto-complete model which has been shown in the same attachment(image3&4). the issue now is, when i select the product from my first dropdown, the second dropdown value is not loading, with firebug i checked, the values are properly retrieved for second dropdwn based on first drpdown but its not shwn up in the value list of second dropdwn. I don know what exactly the problem is. I m thinking it might be the clash of jquery versions that i m using. So, can some sort me out the problem with my form. I have included the form code here. <link rel="stylesheet" href="<?php echo HOME_URL; ?>chosen/chosen.css" /> <style type="text/css"> td { width:800px; } </style> <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> <script type="text/javascript" charset="utf-8"> $(function(){ $("select#product_id").change(function(){ var get_package_url = '<?php echo HOME_URL; ?>select.php'; $.getJSON(get_package_url,{product_id: $(this).val(), ajax: 'true'}, function(j){ var options = ''; options += '<option value="0"> -- Select -- </option>'; for (var i = 0; i < j.length; i++) { options += '<option value="' + j[i].optionValue + '">' + j[i].optionDisplay + '</option>'; } $("select#package_id").html(options); }) }) $("select#package_id").change(function(){ var get_package_url = '<?php echo HOME_URL; ?>select.php'; $.getJSON(get_package_url,{package_id: $(this).val(), ajax: 'true'}, function(j){ for (var i = 0; i < j.length; i++) { var value = j[i].optionDisplay; } $("#package_qty").val(value); }) }) }) </script> <script> $(function() { $( "#datepicker" ).datepicker({ altFormat: "dd-mm-yyyy" }); }); </script> <form action="<?php echo base_url(); ?>purchase_order/add" method="post"> <table border="1"> <tr> <td> <b>Product </b> <select name="product_id" style="width:250px;" data-placeholder="Choose a Supplier..." id="product_id" class="chzn-select"> <option value="0"> -- Select Product -- </option> <?php foreach($get_all_product as $value) { ?> <option value="<?php echo $value['product_id']; ?>"><?php echo $value['product_name']; ?></option> <?php }?> </select> </td> <td> <b>Order Qty </b> <input type="text" name="quantity" value="" style="width:75px;" /></td> <td> <b>Package</b> <select name="package_id" id="package_id"> </select> </td> <td> <b> Qty / Packing</b> <input type="text" name="package_qty" id="package_qty" value="" readonly="readonly" style="width:75px;" /></td> <td colspan="2"> <input type="submit" name="submit" value="Add to Cart" /> </td> </tr> </table> <script src="<?php echo HOME_URL; ?>chosen/chosen.jquery.js" type="text/javascript"></script> <script type="text/javascript"> $(".chzn-select").chosen(); $(".chzn-select-deselect").chosen({allow_single_deselect:true}); </script> </form><br/><br/> <?php if($this->cart->contents()) { ?> <h2>Ordered Cart</h2> <br/> <table border="1"> <tr> <td> <b> Product </b> </td> <td> <b> Order Qty</b> </td> <td> <b>Qty/ Packing</b></td> <td> <b> MRP</b> </td> <td align="right"> <b>Amount </b></td> <td align="right"> <b>Action </b></td> </tr> <?php $grand_total = 0; foreach ($this->cart->contents() as $items) { ?> <tr> <td> <?php echo $items['name']; ?></td> <td> <?php echo $items['qty']; ?></td> <td> <?php echo $items['package_qty']; ?></td> <td> <?php echo $items['price'];//money_format('%!i',$items['price']); ?></td> <td align="right"> <?php echo $items['amount'];//money_format('%!i', $items['amount']); $grand_total = $items['amount']+$grand_total; $discount= $grand_total * 40/100; $gross_amount = $grand_total-$discount; ?></td> <td align="right"> Remove </td> </tr> <?php } ?> <tr> <td colspan="5" align="right"><b>Grand Total</b></td> <td align="right"><b><?php echo $grand_total;//money_format('%!i', $grand_total); ?></b></td> </table> <form method="post" action="<?php echo base_url()."purchase_order/create"; ?>"> <BR/> <BR/> Addtional Details : <textarea rows="5" cols="80" name="info"></textarea> <BR/> Date : <input type="text" name="date" value="<?php echo date('d-m-Y'); ?>" /><br/><br/><br/> <h2> Approximate value of Order</h2><br/> <b>Gross Amount:<b><?php echo $grand_total;?><br/> <b>Less Discount @ 40%:<b><?php echo $discount;?><br/> <b>Net Amount:<b><?php echo $gross_amount;?><br/> <input type="submit" name="submit" value="Create PO" /> </form> <?php } ?>

I need some help trying to get this page to load the "#page1" when the page initially loads. I've tried a couple things but am either getting nothing (from the display:none in CSS) or if I remove that, it displays all the "#page1-6" elements alltogether when the page initially loads. It works fine once I start clicking the menu, its just the initial loading. .page { position: relative; display: none; } </style> </head> <body > <script src="jquery.js"></script> <script> $(document).ready(function() { $(".page-link").on("click", function(e) { $(".page").fadeOut(250); setTimeout(function() { $($(e.currentTarget).attr("href")).fadeIn(250); }, 250); }); });</script> <ul class="semiopaquemenu"> <li><a href="#page1" class="page-link"><span class="titlefont">Gallery</span></a></li> <li><a href="#page2" class="page-link"><span class="titlefont">Bio</a></li> <li><a href="#page3" class="page-link"><span class="titlefont">Statement</span></a></li> </ul> <div id="pages"> <div id="page1" class="page"> <h1>Page 1</h1> <p>This is the first test page.</p> </div> <div id="page2" class="page"> <h1>Page 2</h1> <p>This is the second test page.</p> </div> <div id="page3" class="page"> <h1>Page 3</h1> <p>This is third test page.</p> </div>

Hi all, I am making a flight search engine where i am trying to create a autocomplete textbox. I mean when a user starts typing in the textbox, it will show all related data from my database table. I am new to programming and therefore I have adopt a code from online but it doesn't work, I don't know why. Can anyone please help? If you know any other easy way of doing it, please tell me also This is my Javascript code: <script type="text/javascript" src="js/jquery-1.4.2.js"></script> <script type='text/javascript' src="js/jquery.autocomplete.js"></script> <script type="text/javascript"> $().ready(function() { $("#depAirport").autocomplete("autoCompleteMain.php", { width: 260, matchContains: true, //mustMatch: true, //minChars: 0, //multiple: true, //highlight: false, //multipleSeparator: ",", selectFirst: false }); }); </script> This is my html: <form> <label for="depAirport">Deperture airport</label> <input type="text" id="depAirport" name="depAirport" placeholder="Type destination airport" required autofocus> </form> and this is my php: <?php $host="localhost"; // Host name $username="root"; // Mysql username $password="root"; // Mysql password $db_name="airline_database"; // Database name $con = mysql_connect($host,$username,$password) or die(mysql_error()); mysql_select_db($db_name, $con) or die(mysql_error()); $q = strtolower($_GET["q"]); if (!$q) return; $sql = "select DISTINCT departure_airport as departure_airport from depAirport where departure_airport LIKE '%$q%'"; $rsd = mysql_query($sql); while($rs = mysql_fetch_array($rsd)) { $cname = $rs['departure_airport']; echo "$cname\n"; } ?> PLEASE HELP ASAP

how to submit form in selected tab without any refresh and only stay on that tab???

I'm hoping someone can help me out with this, I'm relatively new to PHP as my background is ASP, so I'm a bit stuck. I'm using the following code as demonstrated here htmlblog.us/jquery-autocomplete ...and I've customized it (slightly) to pull information from my mysql database. Everything is working fine, however, my problem is that when the user selects a specific location from the dropdown, its passing over the suburb, the state, and the postcode. I only want to pass over the postcode value, so I can handle the results easily on the search results page. If I use this.... while( $row = mysql_fetch_array($rs, MYSQL_ASSOC) ) { $data[] = array( 'label' => $row['pcode_area'] .', '. $row['pcode_state'] .' '. $row['pcode_postcode'] , 'value' => $row['pcode_area'] .', '. $row['pcode_state'] .' '. $row['pcode_postcode'] .'; ' ); It posts this to my search results page... (eg showing a search for Brisbane, QLD; 4000) Array ( [zipsearch] => BRISBANE, QLD 4000; ) I only want the postcode value. So instead, I would like ... Array ( [zipsearch] => 4000; ) I tried doing this.... while( $row = mysql_fetch_array($rs, MYSQL_ASSOC) ) { $data[] = array( 'label' => $row['pcode_area'] .', '. $row['pcode_state'] .' '. $row['pcode_postcode'] , 'value' => $row['pcode_postcode'] .'; ' ); ..which passes over just the postcode like I want, but that's no good because upon selection, the suburb and state disappear leaving just the postcode in the selection box, which may confuse people. I'm pretty sure there's an easy way to do this, but being new to PHP, I'm a bit lost. I would really appreciate some help with this, as I'd like to get this sorted ASAP. Thank you. John

I've searched everywhere and just can't seem to find my answer, so here: I'm powerful with php and that I can deal with, but I never really had the chance to develop my javascript skills. I want to use JQuery to load part of a page in a container div. The problem is every tutorial I check out, the target (or result) div where the content will load is already defined in the function. Is there a way to include 2 arguments like this : (pseudo-code, I don't know the real syntax, still a newb at JQuery) function ajaxpage(url, containerid){ // do the magic here } // and calling the page <a href="javascriptTheJQueryWayHere:ajaxpage('page.php?id=12','load_in_this_div')">link</a> <div id="load_in_this_div"></div> I don't necessarily want a baked answer, just any link to any resource except RTFM would be of great help!

i have a many links like these <a href="www.ex.com/action.php?me=1">member1</a> i wanted to get this by ajax get method.. <script> $("a.member").click(function(e){ $.ajax({ type: "GET", url: "action.php?me=", data: "me=" + me, success: function(data){ alert(data); } }); return false; e.preventDefault(); }); </script> i know somethin wrong here..am in re.php..i am using this to navigate to action.php file.. Any help appreciated..

Before asking any questions,i would like to thank phpfreaks forum for answering my questions.. Really helpful, thanks again.. i have this tabbed menu.. it worked nicee.. but when i add input submit at last, it is not shown,pls help.. might be css issue, tried that some things, but didn't work, pls help... css <style> ul.tabs { margin: 0; padding: 0; float: left; list-style: none; height: 32px; /*--Set height of tabs--*/ border-bottom: 1px solid #999; border-left: 1px solid #999; width: 100%; } ul.tabs li { float: left; margin: 0; padding: 0; height: 31px; /*--Subtract 1px from the height of the unordered list--*/ line-height: 31px; /*--Vertically aligns the text within the tab--*/ border: 1px solid #999; border-left: none; margin-bottom: -1px; /*--Pull the list item down 1px--*/ overflow: hidden; position: relative; background: #e0e0e0; } ul.tabs li a { text-decoration: none; color: #000; display: block; font-size: 1.2em; padding: 0 20px; border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/ outline: none; } ul.tabs li a:hover { background: #ccc; } html ul.tabs li.active, html ul.tabs li.active a:hover { /*--Makes sure that the active tab does not listen to the hover properties--*/ background: #fff; border-bottom: 1px solid #fff; /*--Makes the active tab look like it's connected with its content--*/ } .tab_container { border: 1px solid #999; border-top: none; //overflow: hidden; clear: both; float: left; width: 100%; background: #fff; height:auto; } .tab_content { padding: 20px; font-size: 1.2em; color:#333; height:auto; } * { margin:0; // disable for button padding:0; // disable for button border:0; // disable for button } </style> script for tab <script type="text/javascript"> $(document).ready(function() { //Default Action $(".tab_content").hide(); //Hide all content $("ul.tabs li:first").addClass("active").show(); //Activate first tab $(".tab_content:first").show(); //Show first tab content //On Click Event $("ul.tabs li").click(function() { $("ul.tabs li").removeClass("active"); //Remove any "active" class $(this).addClass("active"); //Add "active" class to selected tab $(".tab_content").hide(); //Hide all tab content var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content $(activeTab).fadeIn(); //Fade in the active content return false; }); }); </script> <ul class="tabs"> <li><a href="#tab1">First tab</a></li> <li><a href="#tab2">Second tab</a></li> </ul> <div class="tab_container"> <div id="tab1" class="tab_content"> Content of the first tab </div> <div id="tab2" class="tab_content"> Content </div> when i used the content area to display my form, it was displayed.. but then when i included the submit button it is not seen.. but then when i use only submit button (no form content)it is displayed. what am doin wrong..pls help..

hello all, am beginning to use jquery.. i am using the code online.. all works fine but when i remove 2 lines it fails.. these two lines are simple input fields.. plss help..no idea what am doing wrong.. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-2" /> <title>Example Ajax and Form</title> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script> <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" /> <script> $(function() { $( "#datepicker" ).datepicker(); }); </script> <script type="text/javascript"><!-- // create the XMLHttpRequest object, according browser function get_XmlHttp() { // create the variable that will contain the instance of the XMLHttpRequest object (initially with null value) var xmlHttp = null; if(window.XMLHttpRequest) { // for Forefox, IE7+, Opera, Safari, ... xmlHttp = new XMLHttpRequest(); } else if(window.ActiveXObject) { // for Internet Explorer 5 or 6 xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } return xmlHttp; } // sends data to a php file, via POST, and displays the received answer function ajaxrequest(php_file, tagID) { var request = get_XmlHttp(); // calls the function for the XMLHttpRequest instance // gets data from form fields, using their ID var nume = document.getElementById('nume').value; var mesaj = document.getElementById('mesaj').value; var datepicker = document.getElementById('datepicker').value; var hour = document.getElementById('hour').value; var minute = document.getElementById('minute').value; var dhour = document.getElementById('dhour').value; var dminute = document.getElementById('dminute').value; // create pairs index=value with data that must be sent to server var the_data = 'datepicker='+datepicker+'&hour='+hour+'&minute='+minute+'&dhour='+dhour+'&dminute='+dminute; request.open("POST", php_file, true); // sets the request // adds a header to tell the PHP script to recognize the data as is sent via POST request.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); request.send(the_data); // sends the request // Check request status // If the response is received completely, will be transferred to the HTML tag with tagID request.onreadystatechange = function() { if (request.readyState == 4) { document.getElementById(tagID).innerHTML = request.responseText; } } } --></script> <style> .left{float:left;} .clear{clear:both;} </style> </head> <body> <br /> <b>Create Appointment</b><br><br> <form action="new.php" method="post" name="form1" onsubmit="ajaxrequest('new.php', 'resp'); return false;"> <label class="left" for="datepicker" id="hour_label" class="small">Hours<br> Date: <input type="text" name="datepicker" id="datepicker"/></label> <br><br><br><br> </form> <br> Trainer Availabity<br> <form action="new.php" method="post" name="form1" onsubmit="ajaxrequest('new.php', 'resp'); return false;"> Your name: <input type="text" name="nume" id="nume" size="20" maxlength="33" /><br /> Your message:<br /> <textarea name="mesaj" id="mesaj" cols="25" rows="4"></textarea><br /> <b>Time</b><br> <label class="left" for="hourid" id="hour_label" class="small">Hours<br> <?php $number = range(00,24); $tempholder = range(00,24); $nr=24; echo '<select class="doba" name="hour" id="hour">'; echo '<option value="" selected="selected">--Select Hour--</option>'; for ($i=0; $i<$nr; $i++) { echo "<option>".$tempholder[$i]."</option>"; } echo '</select>'; ?> </label> <label class="left" for="minute" id="minute_label" class="small">Minute<br> <?php $number = range(1,60); $tempholder = range(1,60); $nr=60; echo '<select name="minute" id="minute">'; echo '<option value="" selected="selected">--Select Minute--</option>'; for ($i=0; $i<$nr; $i++) { echo "<option>".$tempholder[$i]."</option>"; } echo '</select>'; ?> </label> <br><br><br><br> <div class="clear"><b>Duration</b></div> <div class="clear"></div> <label class="left" for="dhour" class="small" id="dhour_label">Hours<br> <?php $number = range(00,05); $tempholder = range(00,05); $nr=5; echo '<select class="doba" name="dhour" id="dhour">'; echo '<option value="" selected="selected">--Select Hour--</option>'; for ($i=0; $i<$nr; $i++) { echo "<option>".$tempholder[$i]."</option>"; } echo '</select>'; ?> </label> <label class="left" for="dminute" class="small" id="dminute_label">Minute<br> <?php $number = range(1,60); $tempholder = range(1,60); $nr=60; echo '<select name="dminute" id="dminute">'; echo '<option value="" selected="selected">--Select Minute--</option>'; for ($i=0; $i<$nr; $i++) { echo "<option>".$tempholder[$i]."</option>"; } echo '</select>'; ?> </label> <input type="submit" value="Search Trainer Availabity" /> </form> <div id="resp"></div> </body> </html> when i remove Your name: <input type="text" name="nume" id="nume" size="20" maxlength="33" /><br /> Your message:<br /> <textarea name="mesaj" id="mesaj" cols="25" rows="4"></textarea><br /> it shows the output php file,not the current file... pls help!!!

I am pulling stock symbols from Yahoo finance in a json object and I am trying to show them as a drop-down menu while the user starts typing the name of the company or the symbol in the search box . Typeahead is not working as a drop down menu from the search box. I think I am doing everything right.This is the code I have so far. Any help is appreciated. quote.js $(document).ready(function() { // create autocomplete $('#form-quote input[name=symbol]').typeahead({ // load autocomplete data from suggest.php source: function(query, callback) { $.ajax({ url: '../suggest.php', type: 'POST', dataType: 'json', data: { symbol: query }, success: function(response) { callback(response.symbols); } }); } }); // load data via ajax when form is submitted $('#form-quote').on('click', function() { // determine symbol var symbol = $('#form-quote input[name=symbol]').val(); // send request to quote.php $.ajax({ url: 'quote.php', type: 'POST', data: { symbol: symbol }, success: function(response) { $('#price').text(response); } }); return false; }); }); quote.php <?php //configuration require("../includes/config.php"); //if form was submitted if($_SERVER["REQUEST_METHOD"] == "POST"){ $stock = lookup(strtoupper($_POST["symbol"])); if(empty($_POST["symbol"])){ //echo "You must enter a stock symbol"; }else if($_POST["symbol"]){ $price = number_format($stock['price'], 2); echo "A share of {$stock['name']} costs $$price"; } } else{ // render portfolio render("stock_search.php", ["title" => "Get Quote"]); } ?> quote_search.php <form id = "form-quote" action="quote.php" method="post"> <fieldset> <div class="control-group"> <input name="symbol" autofocus autocomplete="off" placeholder="Symbol" type="text"/> </div> <div class="control-group"> <button type="submit" class="btn">Get Quote</button> </div> </fieldset> <div id="price"></div> <div id="suggestions"></div> </form> <script type="text/javascript" src="js/quote.js" ></script> quote_search.php <form id = "form-quote" action="quote.php" method="post"> <fieldset> <div class="control-group"> <input name="symbol" autofocus autocomplete="off" placeholder="Symbol" type="text"/> </div> <div class="control-group"> <button type="submit" class="btn">Get Quote</button> </div> </fieldset> <div id="price"></div> <div id="suggestions"></div> </form> <script type="text/javascript" src="js/quote.js" ></script> suggest.php <?php // configuration require("../includes/functions.php"); // if form was submitted if ($_SERVER["REQUEST_METHOD"] == "POST") { // load suggestion data $data = @file_get_contents("http://d.yimg.com/aq/autoc?query= {$_POST['symbol']}&region=US&lang=en-US&callback=YAHOO.util.ScriptNodeDataSource.callbacks"); // parse yahoo data into a list of symbols $result = []; $json = json_decode(substr($data, strlen('YAHOO.util.ScriptNodeDataSource.callbacks('), -1)); foreach ($json->ResultSet->Result as $stock) $result[] = $stock; echo json_encode(['symbols' => $result]); } ?>

Hello good day, I've got here a code for countdown: var times = 50; function startCountdown() { if((times - 1) >= 0){ times = times - 1; $("#refreshTime").html('Auto logout: ' + times); setTimeout(startCountdown, 1000); }else{ //alert('Your session has ended!'); } } But my problem is, I got no idea on function that will reset the time when some click or hover the html body page. Thanks and regards!

I have a function called after some data and the function is given below:- now the problem here is that at the #vote replace the color of the text is not assigned as it should be from where it is loaded I.e it is not red and not as the font size it should be. sorry this could be simple but not getting it. I have also tried to give .css to vote but it is still not applying that function attach() { var id="<?php echo $_REQUEST['id'];?>"; var state="<?php echo $_REQUEST['state'];?>"; $.ajax({ url: "petition_details.php", data: {id:id,state:state} }).done(function(result){ $("#spprt").replaceWith($(result).find("#spprt").html()); $("#vote").replaceWith($(result).find("#vote").html()); //The problem is here $("input[type=text]").val(""); $("textarea").val(""); if($("#ttt").text()=="You supported it before") { $('#ttt').css({'background-color':'#FFCC00','font-size':'16px','border-style':'none'}); } else if($("#ttt").text()=="Thank you for your VOTE") { $('#ttt').css({'background-color':'#00FF00','font-size':'16px','border-style':'none'}); } }); }

Hello All, I am a new member on this forum. i am not a expert, but i want to design a product filter like this image. Please help me in this Issue. better if available in client side scripting.. Thanks in Advance..

I am not entirely sure what this is called, but say for example you have some text on a site, and you want to edit it right there and then, and you just click on the text, and it changes to a text field and you edit the text, then onblur it updates the text with the new content form the text field. What is this called, and what is the best and easiest method of doing it?

Hi guy I hope someone can help with this as im really panicking over it. Ok so im building my first CMS ever! Its about 5 months down the line. Im self taught so making lots of mistakes but im getting there. From the beginning I've been using..... http://caroufredsel.dev7studios.com/ for image scrollers and such. Works great!!!!!! I highly recommend!!!!!!! Basically I've come to check my webpage and it looks great. my images scroll and my services scroll. Ive checked it in Crome, firefox, safari, IE8, IE9 and it looks great. However load it in IE7 and real problems occur. It seems all my CSS to do with the carousel boxes just gets completely ignored! As much as i dont want to show a site that is working in a awful state with broken links and text im afraid ill have to for the purpose of this post. Please view the site in any browser then view it in IE 7 and you will see what I mean. wooden.yourarena.co.uk/ I have the code for the scroller below. $(document).ready(function() { $("#servicescroller").carouFredSel({ width: "100%", responsive: true, circular:true, infinite:true, height: 340, items: { visible: { min: 3, max: 4 }, width: 220, height: "variable", }, scroll: { duration: 1000, items: 1, pauseOnHover: true }, auto: 4000, swipe: true, mousewheel: true }); $("#foo<?php echo $row['randname'];?>").carouFredSel({ prev : { button : "#foo_prev", key : "left", items : 1, easing : "easeInOutCubic", duration : 750 }, next : { button : "#foo_prev", key : "right", items : 1, easing : "easeInQuart", duration : 1500 }, width: 500, height: 245, items : { visible :1, minimum: 1, width: 500, height: 250, }, direction : "up", scroll : { fx: "crossfade", pauseOnHover: true, }, auto : { duration : 2000, timeoutDuration: 5000, delay: 3000, pauseOnEvent: 'resume', } }).find(".<?php echo $row['randname'];?>").hover( function() { $(this).find("div").slideDown(); }, function() { $(this).find("div").slideUp(); } ); }); I have tried every combination of trailing comma's with and without and nothing seems to fix it. I can only assume something else on the page is interfering but I cant see what. I have used this scroller over and over and never had this problem. Can someone please at least tell me a way to debug the error or to even find what the error is. Im in dyer need of help as I have deadlines coming up which I am already way too far behind and I have no clue what the problem is. Thanks for your time guys

I am stuck at this code I am using the jquery to load a entire id which works ok without live but for some reason I need to add live, But after using it the whole document buttons fail to work please help with this. $(document).ready(function(){ $("#td3 a").live("click",function(e){ var id=$(e.target).text(); $("#td1").load("pending_approvals.php #td1",{page:id}); }); }); <tr> <td id="td3"> Enter View Limit:<input type="text" name="limit" /> Pages>> <?php for ($i = 1; $i <= $total_pages; $i++) { echo "<a href='#'>$i</a> "; } ?> </td> </tr>