Response title
This is preview!
- Screen name: helloworld
helloworld's Profile
2 Posts
1 Responses
0
Followers
Activity Trend
Last 30 days
Loading Chart...
Show:
- Expanded view
- List view
- 03-Sep-2012 06:11 PM
- Forum: Using jQuery
Hi,i post this below message in the jquery mobile forum, but this code can work with "normal" jquery too :i need you, please help me
Thank you !
I have 3 forms on the same page. For each, I have 3 radio button, and the form is automatically submitted as soon as I click a radio button.
The value of the radio button is then retrieved from a php page, and rendering is displayed in a div
The following code works fine for one form, but instead of 3 different functions (indicated by the "testsubmit(xx)" in the code), I have wanted to make only one, but I do not know how.>> Please help me :)The code : (i put 2 same form in this exemple, it depends of the good code)---------------index.htm<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0-alpha.1/jquery.mobile-1.2.0-alpha.1.min.css" />
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0-alpha.1/jquery.mobile-1.2.0-alpha.1.min.js"></script>
</head>
<body >
<script type='text/javascript'>
function testsubmit(cadre)
{
var myRadio = $('input[name=radiochoice]');
var test = myRadio.filter(':checked').val();
//alert(test);
$.ajax({
type: "POST",
url: "testpage.php",
data: { name: test }
}).done(function( msg ) {
document.getElementById(cadre).innerHTML=msg
});
}
</script>
<div data-role="page">
<div data-role="header">
<h1>Page Title</h1>
</div><!-- /header -->
<div data-role="content">
<br>
<div class="ui-bar" style="background-color:#999;text-shadow:none; color:#000">
<div style="margin-left:15px">
<form id="testforum" data-ajax="false">
<fieldset data-role="controlgroup" data-type="horizontal" onchange="testsubmit('result')"
data-inline='true' data-native-menu='false' >
<input type="radio" name="radiochoice" id="radiochoice1" value="radiochoice1" />
<label for="radiochoice1">radiochoice1</label>
<input type="radio" name="radiochoice" id="radiochoice2" value="radiochoice2" />
<label for="radiochoice2">radiochoice2</label>
<input type="radio" name="radiochoice" id="radiochoice3" value="radiochoice3" />
<label for="radiochoice3">radiochoice3</label>
</fieldset>
</form>
<div id="result"></div>
</div>
<br><br>
<div style="margin-left:15px">
<form id="testforum" data-ajax="false">
<fieldset data-role="controlgroup" data-type="horizontal" onchange="testsubmit('result')"
data-inline='true' data-native-menu='false' >
<input type="radio" name="radiochoice" id="radiochoice1" value="radiochoice1" />
<label for="radiochoice1">radiochoice1</label>
<input type="radio" name="radiochoice" id="radiochoice2" value="radiochoice2" />
<label for="radiochoice2">radiochoice2</label>
<input type="radio" name="radiochoice" id="radiochoice3" value="radiochoice3" />
<label for="radiochoice3">radiochoice3</label>
</fieldset>
</form>
<div id="result"></div>
</div>
</div>
</div><!-- /content -->
<div data-role="footer">
<h4>Page Footer</h4>
</div><!-- /footer -->
</div><!-- /page -->
</body>
</html>testpage.php<?php echo $_POST['name']; ?>- hello,after trying unsuccessfully for 4 days my script, I need you:
I have 3 forms on the same page. For each, I have 3 radio button, and the form is automatically submitted as soon as I click a radio button.
The value of the radio button is then retrieved from a php page, and rendering is displayed in a div
The following code works fine for one form, but instead of 3 different functions (indicated by the "testsubmit(xx)" in the code), I have wanted to make only one, but I do not know how.>> Please help me :)The code : (i put 2 same form in this exemple, it depends of the good code)---------------index.htm<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0-alpha.1/jquery.mobile-1.2.0-alpha.1.min.css" />
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0-alpha.1/jquery.mobile-1.2.0-alpha.1.min.js"></script>
</head>
<body >
<script type='text/javascript'>
function testsubmit(cadre)
{
var myRadio = $('input[name=radiochoice]');
var test = myRadio.filter(':checked').val();
//alert(test);
$.ajax({
type: "POST",
url: "testpage.php",
data: { name: test }
}).done(function( msg ) {
document.getElementById(cadre).innerHTML=msg
});
}
</script>
<div data-role="page">
<div data-role="header">
<h1>Page Title</h1>
</div><!-- /header -->
<div data-role="content">
<br>
<div class="ui-bar" style="background-color:#999;text-shadow:none; color:#000">
<div style="margin-left:15px">
<form id="testforum" data-ajax="false">
<fieldset data-role="controlgroup" data-type="horizontal" onchange="testsubmit('result')"
data-inline='true' data-native-menu='false' >
<input type="radio" name="radiochoice" id="radiochoice1" value="radiochoice1" />
<label for="radiochoice1">radiochoice1</label>
<input type="radio" name="radiochoice" id="radiochoice2" value="radiochoice2" />
<label for="radiochoice2">radiochoice2</label>
<input type="radio" name="radiochoice" id="radiochoice3" value="radiochoice3" />
<label for="radiochoice3">radiochoice3</label>
</fieldset>
</form>
<div id="result"></div>
</div>
<br><br>
<div style="margin-left:15px">
<form id="testforum" data-ajax="false">
<fieldset data-role="controlgroup" data-type="horizontal" onchange="testsubmit('result')"
data-inline='true' data-native-menu='false' >
<input type="radio" name="radiochoice" id="radiochoice1" value="radiochoice1" />
<label for="radiochoice1">radiochoice1</label>
<input type="radio" name="radiochoice" id="radiochoice2" value="radiochoice2" />
<label for="radiochoice2">radiochoice2</label>
<input type="radio" name="radiochoice" id="radiochoice3" value="radiochoice3" />
<label for="radiochoice3">radiochoice3</label>
</fieldset>
</form>
<div id="result"></div>
</div>
</div>
</div><!-- /content -->
<div data-role="footer">
<h4>Page Footer</h4>
</div><!-- /footer -->
</div><!-- /page -->
</body>
</html>testpage.php<?php echo $_POST['name']; ?>