JavaScript - How Do I Send Javascript/jquery Array To Php?
Hi
How do I send an array created in jQuery or Javascript to PHP? (page will be redirected to PHP) I'm thinking of URL parameters right now, but wont that result to a long URL? Is there another optimized way of sending the array? Here's my script. Which doesn't work. Here's my script, this works fine... send_array_to_other_page.html Code: $(function(){ //DECLARE ARRAY var arr = new Array(); var i = 0; $('#form').submit(function(e){ e.preventDefault(); var value = $('#box').val(); var index = arr.length; var list = ''; //ADD VALUE TO ARRAY arr[index] = value; //OUTPUT VALUES IN ARRAY for (var index in arr){ list+=index+': '+arr[index]+'<br/>'; $('#arrLength').html(arr.length); } //DISPLAY ARRAY $('#display').html(list); $('#form').get(0).reset(); //RESET FORM }); $('#send').click(function(){ window.location = 'send_array_to_other_page_2.php?list='+arr; }); }); This doesn't. It outputs Array content lost. Id also like to point out the the url of this page is send_array_to_other_page_2.php. Its missing the ?list= PHP Code: <?php $arr = $_GET['list']; echo 'The contents of the array are still... <br/>'; if(isset($arr)){ print_r($arr); } else { echo 'Array content lost'; } ?> Similar TutorialsPHP Code: $("#topwraprighttitle > ul > li[id^=d]").click(function() { var mySpan = $(this); var span_id2 = mySpan.attr("id"); span_id = span_id2.replace(/D/g,''); var d0 = [menu1,menu2]; var d1 = [menu5,menu6]; var d2 = [menu5,menu6]; $('#2').fadeTo(240, 0, function(){ $(this).html(d0[0]).fadeTo(240, 1); }); $('#3').fadeTo(240, 0, function(){ $(this).html(d0[1]).fadeTo(240, 1); }); $('.topwraprighttitleactive').removeClass('topwraprighttitleactive'); $(this).toggleClass('topwraprighttitleactive'); }); What I have are 3 links on my page, depending on which link is presed, I am replacing the contents of a div with the contents from an array (d0, d1 and d2). I can successfully replace the contents of the div with new content from those variables. However, I cant get the function to properly choose between d0, d1 and d2 based on which link is clicked. In my code above, all the data is being pulled from d0, but how could I make it variable so that the data would come from d0, d1, d2 based on the id of the link clicked ? I've created the variables span_id and span_id2 above to hold the data on which link id was clicked to help do this, but cant figure out how to actually implement it? Thanks!!!!!! Hi all. I have a form that I am writing which needs to send information contained inside a textbox when the user presses the "Post Comment" button. I want it be sent as a parameter to the addComment() function. How can you do this??? I have been trying to figure it out for a while now but can't seem to get the syntax right. This is what my code looks like currently. If possible I would like this to work without referencing the name of this form. Code: <form method="post" name="form" action="" style="padding:0px; margin:0px;"> <textarea name="content" id="content" style="width:600px; height:114px; font-family:Verdana,Arial,Tahoma,Times New Roman; font-size:12px; border:1px #666 solid;" onFocus="this.value=''; this.onfocus=null;">Enter your comment...</textarea><br /> <input type="submit" value="Post Comment" id="v" name="submit" onclick="addComment(this.content.value);" /> <span id="wait"></span><span id="flash"></span> </form> Hello, In the following code i'm trying to check if the value of the text field is exist in the array. the problem that the function dose not accept the the value(node.value) from the text field. Code: <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Text Validation</title> <script type="text/javascript" language="javascript"> Array.prototype.inArray = function (value) { // Returns true if the passed value is found in the // array. Returns false if it is not. alert(value); var i; for (i=0; i < this.length; i++) { if (this[i] == value) { return true; } } return false; }; function cal(xx) { var node_list = document.getElementsByTagName('input'); arr = new Array(""); for (var i = 0; i < node_list.length; i++) { var node = node_list[i]; ///alert(node_list.length); // alert(node.value); arr.push(node.value) } alert(xx.length); //var arr= new Array(1,2,3,4,5,6,7,8,9,10); if(xx.length!=0) { if(arr.inArray(xx)) { alert("Your value is found in the Array"); } else { alert("Your value is not found in the Array"); } } } </script> </head> <body> <form id="text_validation" name="text_validation" action="" method="post"> <table width="600" border="1"> <tr> <td><label for="abc_text_1" id="abc_text_1_lb">Text 1</label> </td> <td>:</td> <td><input type="text" id="abc_text_1" name="abc_text_1" onblur="return cal(this.value);" /></td> </tr> <tr> <td><label for="cde_text_2" id="cde_text_2_lb">Text 2</label> </td> <td>:</td> <td><input type="text" id="cde_text_2" name="cde_text_2" value="abc" /></td> </tr> <tr> <td><label for="fgh_text_3" id="fgh_text_3_lb">Text 3</label> </td> <td>:</td> <td><input type="text" id="fgh_text_3" name="fgh_text_3" value="abcaaaaa" onblur="return testvalidation(fgh_text_3);" /></td> </tr> <tr> <td><label for="ijk_text_4" id="ijk_text_4_lb">Text 4</label> </td> <td>:</td> <td><input type="text" id="ijk_text_4" name="ijk_text_4" onblur="return testvalidation(ijk_text_4);" /></td> </tr> <tr> <td><label for="lmn_text_5" id="lmn_text_5_lb">Text 5</label> </td> <td>:</td> <td><input type="text" id="lmn_text_5" name="lmn_text_5" onblur="return testvalidation(lmn_text_5);" /></td> </tr> <tr> <td><label for="opq_text_6" id="opq_text_6_lb">Text 6</label> </td> <td>:</td> <td><input type="text" id="opq_text_6" name="opq_text_6" onblur="return testvalidation(opq_text_6);" /></td> </tr> <tr> <td><label for="rst_text_7" id="rst_text_7_lb">Text 7</label> </td> <td>:</td> <td><input type="text" id="rst_text_7" name="rst_text_7" /></td> </tr> <tr> <td><label for="uvw_text_8" id="uvw_text_8_lb">Text 8</label> </td> <td>:</td> <td><input type="text" id="uvw_text_8" name="uvw_text_8" /></td> </tr> <tr> <td><label for="xyz_text_9" id="xyz_text_9_lb">Text 9</label> </td> <td>:</td> <td><input type="text" id="xyz_text_9" name="xyz_text_9" /></td> </tr> <tr> <td><label for="klm_text_0" id="klm_text_0_lb">Text 10</label> </td> <td>:</td> <td><input type="text" id="klm_text_0" name="klm_text_0" value="10" /></td> </tr> </table> </form> </body> </html> Hi there, I guess my question is very novice but I have to ask it. I can find lots of "form applications" on internet. But anytime I check them I cannot see any "send" button help. I mean I know that when I click it, it wont send the informations to my e-mail page. Because they don't show where to insert my email address there, in the example. So how can we make a form work for us, how can we arrange it to send the informations to our e-mail address? Do we need to use a php file for it? if yes, how? Regards and Thanks in advance Is it possible to use JavaScript to send a HTML FORM this way? (By the way, this is a huge guess - I don't know JavaScript very well) Code: <SCRIPT type="text/javascript"> function Cart1Function() { get.INPUT.quantity.value send.to.formsubmit1.php } function Cart2Function() { get.INPUT.quantity.value send.to.formsubmit2.php } </SCRIPT> <FORM action="?" method="post" name="form"> <DIV> <INPUT type="text" name="quanitity"> <INPUT type="submit" value="CART 1" onClick="Cart1Function"> <INPUT type="submit" value="CART 2" onClick="Cart2Function"> <DIV> </FORM> I want to make two forms sharing the same input (quantity). Hi, I wanted to know if there is way in Javascript to send a hidden variable to an external URL without actually submitting to the URL? Code below is what I intend to do. I want to use an image to do an onClick event and send the name to an external URL without actually doing a submit. Code: <td width="25"> </td> <input type="image" src="images/btn_Activate.gif" onClick="window.location.href='www.abc.com'"> <input type="hidden" name="name" value="<% = name %>"> </td> Thanks. Jeeten. (I also posted this on stackoverflow, but haven't had any replies.) I have a script that sends a POST to a php file, and gets a new integer (primary key). Then the script creates 3 new divs, with that ID included in them as an attribute. Now, I need to be able to grab the ID and give it back to PHP when the user updates it. (It's currently a div, but later it will be an editable form.) I was going to do this by creating a button in the same script that I use to create the divs, bearing the same integer and calling a function. The problem with this concept, is that I have no idea how to create a Unique variable to pass along to the function, so it knows which number to look at. Obviously, if I have only one variable that gets overwritten with each new entry - after all of the rows load, only the last row will have a variable that matches its id. Another option is to find the value of all attributes that bear the name data-integer-question and pass its number/integer to a function, when the user does something like keyup enter. However, I have no idea how to do that. obj.returnIntJson holds the integer that I've been talking about, which changes for each row. rowNumberObj.qarowcontainer is just a reference for the parent div, which doesn't get edited by the user - you can ignore it. The script gives a result like this: <div id="questioncolumn" class="questionColumnCSS" data-integer-question="701"></div> Suggestions on how to proceed? Here's the code for one of the divs, Thanks. PHP Code: qaRowQuestion = document.createElement('div'); qaRowQuestion.setAttribute('id', "questioncolumn"); qaRowQuestion.setAttribute('data-integer-question', obj.returnIntJson); qaRowQuestion.setAttribute('class',"questionColumnCSS"); qaRowQuestionParent = document.getElementById(rowNumberObj.qarowcontainer); qaRowQuestionParent.appendChild(qaRowQuestion); Hi, I have done a script in Jquery that resolved my problem in Firefox and Chrome but not in IE. Thought of going back to Javascript. Could you please update me the equivalent for this Jquery stuff. <script type="text/javascript"> jQuery(document).ready(function(){ var backSize = (${not empty param.backSize ? param.backSize : 0} + 1); $("#goBackResults").attr("href", "javascript:history.go(-" + backSize + ");"); var existingValue = 'backSize=' + (backSize-1); $("#when-did-i-buy .pageNum a").each(function(){ if ($(this).attr('href')) { var newValue = 'backSize=' + backSize; if ($(this).attr('href').search('backSize=')!=-1) { var t=$(this); t.attr('href', t.attr('href').replace(existingValue,newValue)); } else { $(this).attr('href', $(this).attr('href') + "&tabId=1&backSize=" + backSize); }} }); }); </script> Thanks, Ravi.P Hi, Can anyone help me on converting this code to jquery: Code: <html> <head> <script type="text/javascript" src="jquery-1.6.1.min.js"></script> <script type="text/javascript"> function showonlyone(thechosenone) { var noticecontent = document.getElementsByTagName("div"); for(var x=1; x < noticecontent.length; x++) { name = noticecontent[x].getAttribute("name"); if (name == 'noticecontent') { if (noticecontent[x].id == thechosenone) { noticecontent[x].style.display = 'block'; } else { noticecontent[x].style.display = 'none'; } } } } function showall(id) { showall.ud=showall.ud||false; var i=1; while (document.getElementById(id+i)){ document.getElementById(id+i).style.display=showall.ud?'block':'none'; i++; } showall.ud=!showall.ud; } </script> </head> <body> <center> <div id="parentdiv" > <div id="expandall" onmouseup="showall('noticecontent')" >OPEN/CLOSE ALL</div> <div id="noticeheading1" class="noticeheading" name="noticeheading"; onClick="showonlyone('noticecontent1');">Heading 1</div> <div id="noticecontent1" name="noticecontent" class="noticecontent">awertysergyetwhwgertrhztrxdtykpopmift6hwe5awfwedaserhdy4hatefeshdgtrgd</div> <div id="noticeheading2" class="noticeheading" name="noticeheading"; onClick="showonlyone('noticecontent2');">Heading 2</div> <div id="noticecontent2" name="noticecontent" class="noticecontent">fh56serhgzsrxdtrjhgzsrltkjuytinubvre6io4exjhgftxtrokzet6ttawruthrthwru</div> <div id="noticeheading3" class="noticeheading" name="noticeheading"; onClick="showonlyone('noticecontent3');">Heading 3</div> <div id="noticecontent3" name="noticecontent" class="noticecontent">fdfjesrtaw5u4wgy5gw45use4syzerhgtawerfatrastaghgryseerathw5uz4de5ser5s</div> </div> </center> </body> </html> thanks I have a code written in jquery which I have to transform to javascript. is there any tool for this or I have to do this manually? Please help.. JAVASCRIPT (move.js); Code: <script type="text/javascript"> $().ready(function() { $('#ex3').jqDrag('.jqDrag').jqResize('.jqResize'); }); </script> HTML: Code: <script src="includes/js/move.js"></script> <div id="ex3" class="jqDnR"> <div class="jqHandle jqDrag"></div> <br /> MY DATA <div class="jqHandle jqResize"></div> </div> hi how can i make somethin like the menus A,b, bla bla one this site? http://www.kanzenanimes.net/animes Hello, posted this on dynamicdrive.com with no response, so I am trying this forum. I have been assigned to build a content locator. We cannot use a database and all content needs to load from same page. Based on my boss' design and client needs, this is what I came up with: http://contentx.com/content_locator/ I am using a Dynamic Drive script to power the dropdown and content underneath the drop down, http://contentx.com/content_locator/js/dd_cx_script.js and using a JQuery script to change the content in the window to the right. http://contentx.com/content_locator/...s_cx_script.js My questions a 1) Is there a better method to do this? (stupid question I know... of course there is!!) I would like it to be as simple as possible, no animation needed. Just need to have content from the DIV on the right side load content in the Main body div on the left (the box) 2)Is it possible to change the content on the right side when you select an option from the drop down? (say I select <option>Free Campaigns</option> I want the content to change on the right to match one of the free campagins) 3)Finally, my margins in IE 7 are all over the map, looks great in all other browsers, but in IE my TABS (colored green and blue) are about 10pixels up to high, and my belowcontent div on the left has a top margin of 12px below the dropdown... Thanks for any help, zack I am working on a page where the user will select a location from a dynamically generated dropdown list. I was able to create the php multidimensional array (tested and working) from a MySql database using the users information at login, but I'm having problems converting it to a javascript multidimensional array. I need to be able to access variables that I can pass to a number of text fields within an html form. For instance, if a user belongs to a company with multiple addresses, I need to be able to let them select the address they need to prepopulate specific text fields. php array creation: Code: if ($row_locations) { while ($row_locations = mysql_fetch_assoc($locations)) { $mail[$row_locations['comp_id']]=array('mailto'=>$row_locations['mailto'], 'madd'=>$row_locations['madd'], 'madd2'=>$row_locations['madd2'], 'mcity'=>$row_locations['mcity'], 'mstate'=>$row_locations['mstate'], 'mzip'=>$row_locations['mzip'], 'billto'=>$row_locations['billto'], 'badd'=>$row_locations['badd'], 'badd2'=>$row_locations['badd2'], 'bcity'=>$row_locations['bcity'], 'bstate'=>$row_locations['bstate'], 'bzip'=>$row_locations['bzip']); } } javascript function - this should create the array and send variables to text fields. Code: function updateAddress() { var mail = $.parseJSON(<?php print json_encode(json_encode($mail)); ?>); { if (comp_id in mail) { document.getElementById('mailto').value=mail.comp_id.mailto.value; document.getElementById('madd').value=mail.comp_id.madd.value; document.getElementById('madd2').value=mail.comp_id.madd2.value; document.getElementById('mcity').value=mail.comp_id.mcity.value; document.getElementById('mstate').value=mail.comp_id.mstate.value; document.getElementById('mzip').value=mail.comp_id.mzip.value; } else { document.getElementById('mailto').value=''; document.getElementById('madd').value=''; document.getElementById('madd2').value=''; document.getElementById('mcity').value=''; document.getElementById('mstate').value=''; document.getElementById('mzip').value=''; } } } Where is this breaking? Thanks in advance. I'm trying to build a gallery. So far I've used jquery for the scrolling thumbnails. The problem I am having is deciding which would be the best way to load the larger version of the thumbnails into a div? Currently I am using a jquery attribute replace, but the only problem I'm having is I want to use lightbox for the large images. Some of the images have text so they need to be big if the user would like to read them. Right now lightbox is working except that it doesn't understand what image it's on when you click on the large version. I believe this is because of the attribute replace. Here is where you can view the problem: http://www.tsutsumidaphoto.com/Mihoko/akiko3.php If you click on any thumbnail after the first then click on the large version it will bring up the first image then go from there. Any suggestions, I've tried for too long on my own! Hi guys, been running into some problems with all IE browsers and my jQuery Gallery from Galleryview. Background: I am using Java to do an image search and build up some HTML including the calls to run the galleryview scripts and return this back to the page using document.write() When I use the simple structure of placing the scripts and parameters into a sample page: Code: Code: <body> <script type="text/javascript" src="http://spaceforaname.com/js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="http://spaceforaname.com/js/jquery.easing.1.3.js"></script> <script type="text/javascript" src="http://spaceforaname.com/js/jquery-galleryview-1.1/jquery.galleryview-1.1.js"></script> <script type="text/javascript" src="http://spaceforaname.com/js/jquery-galleryview-1.1/jquery.timers-1.1.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#photos').galleryView({ panel_width: 800, panel_height: 300, frame_width: 100, frame_height: 100 }); }); </script> It works fine. When I try and pull all the scripts out of the page and inject them back in using document.write() I get an error on IE: Code: Code: sb.append("(function(){ document.write('" + " <script type=\"text/javascript\" src=\"http://spaceforaname.com/js/jquery-1.3.2.min.js\"></script> " + " <script type=\"text/javascript\" src=\"http://spaceforaname.com/js/jquery.easing.1.3.js\"></script> " + " <script type=\"text/javascript\" src=\"http://spaceforaname.com/js/jquery-galleryview-1.1/jquery.galleryview-1.1.js\"></script> " + " <script type=\"text/javascript\" src=\"http://spaceforaname.com/js/jquery-galleryview-1.1/jquery.timers-1.1.2.js\"></script> " + " <script type=\"text/javascript\"> " + " $(document).ready(function(){ " + " $(\"#photos\").galleryView({ " + " panel_width: 800, " + " panel_height: 300, " + " frame_width: 100, " + " frame_height: 100 " + " }); " + " }); " + " </script> " +............+ "')})()"); The variable sb is a StringBuffer and is formatted and returned: Code: Code: nextPage.setValue(sb.toString()); nextPage.setEscapeHTML(false); return nextPage; This particular error in this case in IE(8) is: Object expected which I think is referring to the jQuery as the resulting images are displayed just not in Galleryview style. This is really wracking my brains and any and all help is appreciated. D. Hi! I couldn't find any information about this topic in the internet and I really wonder, how come people do not discuss it anywhere? Okay, jQuery works really great and offers many interesting effects, but what if you have JavaScript disabled? I mean I've browsed through several websites powered by jQuery with JS disabled and they doesn't work or behave weird. I know there aren't much people, who disable JS, but well I do want my page to be seen by all people in the end. I managed to do it with slider on my page (however I want to use other jQuery effects), but, for example, http://www.flowplaye...ools/index.html doesn't provide any information about this. Try to disable JS and see that nothing works. I can use <noscript></noscript> tag, but I have to make two main pages. And what if I want to view it on one page? What would you do? Regards, Aleks. Hello! I am developing my personal website! And I am trying to implement it with JS completely. which means I need the page to be one front end page. But the back-end pages would be the ones which do the work and calculations! In other words and more explaination: I would like to have one "index.php" page that contains only a nav bar which handles the mission. Once the page load it loads with the content of "home.php" (the landing page) if the "contact" tab is clicked then I would like to load the "ContactMe.php" page content. I have done this already! but the problem is: "home.php" uses alot of javascript functions and jquery plug-ins. when I load it, it looks messy that you think the JS is disabled in your machine :-\ Note: the loading has been done with those methods: .load(), $.ajax! -> same results! The conclusion: * "home.php" * "ContactMe.php" * "About.php" Is it possible to load those pages in the "index.php" and still have their JS functions function correctly and display as if they were accessed individually? The goal that I am trying to achieve is that I make my whole website for the visitor as "One Page Site"! I am challenging myself with it though! Thank you in advance for your informative posts! Please Note that I have only put the <html><head><body> tags in the index.php and removed them from the back-end pages such as home.php, contactme.php and about.php! for that sake that it works correctly! but with no hope! I am being told that a snippet of JQuery code in a website that I have inherited is having problems with a $() JQuery Library Implementation. It seems to keep throwing a "tagName" error. An offered solution was to recode the JQuery into traditional JavaScript using getElementById(). I'm new to JavaScript and clueless to JQuery. I'm not exactly sure how to start. How would something like this be changeable to Javascript? Code: <script type="text/javascript"> $(document).ready(function() { $(".signin").click(function(e) { e.preventDefault(); $("fieldset#signin_menu").toggle(); $(".signin").toggleClass("menu-open"); document.forms["loginForm"].elements.loginUser.focus(); }); $("fieldset#signin_menu").mouseup(function() { return false }); $(document).mouseup(function(e) { if($(e.target).parent("a.signin").length==0) { $(".signin").removeClass("menu-open"); $("fieldset#signin_menu").hide(); } }); }); </script> nevermind i figured it out myself
|