I'm trying to write a progressively enhanced web application. I have an index page and a form with some select boxes and some radio buttons on a different php page. Before enhancement occurs, the form is accessible via regular links and everything works as expected. No issues.
In the enhanced version of the application, the form is AJAXed into the index page. When this occurs, the select boxes in the form work perfectly. The radio buttons are initially unchecked and I can check one option as usual. However, once one is checked, clicking the other radio options does nothing. I am unable to check a different option.
Anybody got a clue what the problem is?
Using Chrome by the way. Firefox is the same as Chrome. In IE I can't even check a radio button the first time.
Here's the code that's ajaxed in:
<label>First Time Buyer Status
<!--These values can't be 1/0 because 0 stands for not set-->
<input type="radio" name="FTB" id="FTBYes" value="1" <?php $M->checkFTBValue(1); ?> title=""/>First Time Buyer
[Code].....
The PHP script you see there checks if the value on the server matches the value of the radio button and echo's checked="checked" if true. I thought this could be causing the problem initially but the exact same code is used in the non-enhanced version and it works fine. I tried commenting it out anyway but it makes no difference.
The only thing I can think of is that some javascript is preventing me from selecting a different radio option. That would explain why it works ok in the non-enhanced version because there is no JS there. I can't find anything that I've written that might cause this effect I'm using jQuerys form plugin on my pages. I'm going to try writing it out and see if that fixes anything.
In the mean time, is there a way I can check if any JS functions when I click on the radio button?
Sorry if this is in the wrong forum, there's so many different languages involved, I hadn't a clue where to put it.
I've been struggling trying to get a small order form to work the way I want it to. Here is a link to the live page: [URL] And here is the code in question:
[Code]...
I have two questions...
Question 1 How can I make this piece of script act a little smarter. Look at the order form, I'm catering for up to 4 people and providing lunch for them. If they select 3 people and the spaghetti bol for lunch, it's only adding $10 where it should be adding $30. Obviously this is simple multiplication but since the values in my form are prices it makes it a little tricky. I'm guessing an onselect on the first part of the form which changes the pricing of the other items would be the way to go, but how do I do this?
Question 2 The "Total Price" is placed before the <form> tag by the script. This is ok but it's not where I want it. How can I position this text elsewhere in the document?
Here is the issue I am having: In my project, I have a index.php page with a sidebar menu and a div id called œcontent.The user can select different menu items and perform searches from the database and make updates to their account. Im using ajax to load all of the menu items and all of the forms into the div id "content" on the index page. The Forms all load into the target div as they are suppose to with ajax.
However, on the mysettings page I have two forms and two different buttons, one called save and the other called update. When a user wants to edit their account information and makes changes to their account they clicks on either button and the form processes the information and updates or inserts data into the database correctly but the problem is that after that the form or page does not display the form back in the div id "content" like how it was loaded originally in the index.php page. The problem is that it reloads or refreshes the form page without the index.php page being involved. That is does not get reloaded or updated inside the index.php page content div again.
What I would like do is have all of my forms process whatever is submitted on the page and display the results back inside the same content div on the index.php page again. I know I am missing something because all of my forms are doing the same thing. I am hoping someone can help me out. I would be very grateful for example code that I can learn from since I am still relatively new to web development. I am posting some sample code below.
I load into a div on index.php page via AJAX another php page. Once that page loads, I lose all the function of that page. For example, I click on the search or submit button and nothing happens.
I am trying to create a site using mostly PHP and MySQL and I have integrated some AJAX functions into the site to load new PHP pages into a DIV called "dynamic" on the index.php page without having to reload the entire page. This is working great.
However, when I use the menu with the following hyperlink <a href="javascript: addContent('sample.php', 'dynamic')"> calling the AJAX code to load the sample.php page inot the the DIV dynamic, the sample.php pages loads into the DIV but the PROBLEM is that the submit, and or search functions on the sample.php page stop working.
I believe that this has something to do with using the AJAX code because it is Asynchronous. Perhaps I need to use live or event delegation.
Since I am new to webdevelopment and trying to learn best practices if anyone knows a good way to load PHP forms into a DIV on perhaps a index.php page and then have the form controls still work.
Also I have been using NuSphere PhpED for an IDE which has helped me step through PHP and MySQL code to solve problems real well. However, I would like to get a recommendation on a IDE to use with Java Script and AJAX. Part of my problem with resolving this issue is that I can't step through the code to see what is not happening..
On clicking 'OS' radio button I want to get the 1st form and hide second one and on clicking 'Platform' radio button I want the second form and hide the first one.
I am a PHP programmer and new to Javascript and jQuery and I have tried about 20 examples/tutorials and cannot seem to get even close to what I want.I have a form (PHP/MySQL) with a list of subjects I got from my database, and then create a set of radio buttons from that list. And based on what radio button they select, I need to pass that variable to a div (at least that's what I want to use) and then show a list of videos that match the radio buttons value. I don't care if its a get or post or other.I tried to use GET or POST so I can use that value for my PHP/MySQL lists.I am open to any suggestions/tutorials, etc.
I'm trying to use cluetip jquery plugin inside a message_container div which will be updated once in a while through ajax. The plugin works just fine in any other div, but it seems that in message_container div the already loaded external javascripts are not present ie the plugin doesn't work. Do you have any ideas what would be a proper solution for this issue?
within this page that has been created, there is an AJAX tree folder which calls another page to be loaded into a DIV by AJAX again. Code:
[Code]...
I don't know why it doesn't work because the page has been loaded with the JS file, but as soon as the link is added afterwards it doesn't work. I take it this is because it doesn't know where to find the JS, but how can I overcome this?
I have a simple product order form that's working nicely, but now I needed the radio buttons to select as soon as the client fills in anything for that product (I need to reciev the value associated to that radio button)
I am trying to get a css-styled button to stay on its 'roll-over' state once it has been selected by its corresponding radio button (connected via the label tag). So far, I have no idea what I'm doing.
I have a calculator that I want users to be able to select a radio option that will display the coresponding calculator and hide it when the other radio button is selected in other words I want to only have one visible div at a time. How would I do this?
Here is my Javascript:
HTML Code: <html> <head> <script type="text/javascript">
I have a form that I am validating all fields. I successfully completed the Javascript functions for that...the problem is that within this validation I need to check if a specific selection was made within a radio group (array) and if , let's say "Yes" was selected, then another radio group would not be required. Code:
I'm trying to get the following code to work. It's fine if there are only 2 sets, but once you add a 3rd or 4th it breaks. making a choice of either regular non-member or student member & then changing to another choice fails to disable the last button and also fails to clear selections.note that it is not a requirement that i use radio buttons for the disabled/enabled choices; they could be checkboxes instead.
Code:
<script language="JavaScript"> function Disab (val) { if(val=="0")
I load a page with two default images and two radio buttons not selected. When either of the radio buttons gets checked I need to swap corresponding image. I tried this but it does not seem to work:
I have a php page called: radio_page.php, it contains two radio buttons. First radio button is checked as default when loading the page. I need when clicking on second radio button to refresh the page and keep selection on second radio button, I am trying that as below, but it does not work. After refreshing the page the selection returns to the first radio button.[code]...
If the first radio button is selected, I only want all three buttons to be visible to the user.
If the second radio button is selected, I only want the "Edit Data" and "View Data" buttons to be visible.
If the third radio button is selected, I only want the "View Data" button to be visible.
Is it possible to accomplish this in Javascript? In particular, I want to continue using the "input type=submit" buttons without having to create my own.
I have a form with a list of subjects (radio buttons) that I get from my database with PHP, and I want to show a list of videos (also from my video table using PHP), based on which subject they choose.
I have tried multiple POST, GET methods with JavaScript examples, but cannot get it to work. I am not having any issues with the PHP getting either list, it is just getting the radio buttons to pass either the POST or GET data to JavaScript, and have it take that value so I can get the list from my database with PHP. I tried to use a div for the list of videos, and didn't have much success.
I have 3 divs that contain radio with labels and beneath each radio button I would like to show/hide a form based on whether the radio is selected or not.
Code idea:
So if the radio1 input is selected this would show form1. Selecting radio2 input would hide any other forms (form1, form3) and show form 2 etc.
I want that a <div> element will show when yes is selected and when no it should be hidden. For show and hind i will use the functions from the jQuery UI. But I don't find a way to call the hide / show function when the selection change.
The radio selection: <input type="radio" name="lang_anz" value="1"> Yes<br> <input type="radio" name="lang_anz" value="0" checked="checked"> No<br> When I understand the documentation I can request the current value from the radio with: <script type="javascript"> $('input:radio[name=lang_anz]:checked').val(); </script>But how i can now call the show / hide function when I change the selection?
