here is my javascript
<script>
jQuery(function ($) {
$('.button').on('click', function () {
var id = $(this).data('id');
$.ajax({
url: '/ajax.php',
data: {
id: id
},
method: 'POST',
success: function (html) {
$('body').append(html);
$(html).bPopup();
},
error: function (returnValue) {}
});
});
});
</script>
Here is my html
<input type="text" name="qty" id="qty" maxlength="12" value="1" title="Qty">
<button type="button" class="button small cart-button" data-id="xxxx">Add to Cart</button>
ajax.php
<?php echo $_POST['id']; ?> // show id : xxxx
I want to send qty value for ajax.php file. so how to do it i want to echo it from php.. plz help me for this... thanks
Please try this
<script>
jQuery(function ($) {
$('.button').on('click', function () {
var id = $(this).data('id');
var qtyValue = $("input[type='text'][name='qty']").val();
$.ajax({
url: '/ajax.php',
data: {
id: id,
quantityValue : qtyValue
},
method: 'POST',
success: function (html) {
$('body').append(html);
$(html).bPopup();
},
error: function (returnValue) {}
});
});
});
</script>
Related
<head>
<title>Document</title>
<script>
$(document).ready(function () {
$("#search").on("keyup", function () {
var search_term = $(this).val();
console.log('value--', search_term)
$.ajax({
url: "ajax-live-search.php",
type: "POST",
data: { search: search_term },
success: function (ajaxresult) {
$("table-data").html(ajaxresult);
}
});
});
});
</script>
</head>
<body>
<div id="search-bar">
<label>Search</label>
<input type="text" id="search" autocomplete="off">
</div>
<div id="table-data">
</div>
</body>
PHP page
$search_input = $_POST["search"];
echo $search_input;
error
Notice: Undefined index: search in C:\xampp\htdocs\ajax\ajax-live-search.php on line 3
Change "type" to "method" as below:
$.ajax({
url: "ajax-live-search.php",
method: "POST",
data: { search: search_term },
success: function (ajaxresult) {
$("table-data").html(ajaxresult);
}
});
As you can see I have a for loop with Multiple ID and I want get the value of IDs and pass them to my controller, how can I achieve this ?
<form id="UserEdit">
#for (int i = 0; i < Model.Rights.Count; i++)
{
#Html.HiddenFor(m => m.Rights[i].ID)
}
<input id="BtnEditUserJS" onclick="PostFormUserEdit();" type="submit" value="Edit">
</form>
Generated HTML:
<input id="Rights_0__ID" name="Rights[0].ID" type="hidden" value="31">
<input id="Rights_1__ID" name="Rights[1].ID" type="hidden" value="32">
JavaScript:
function PostFormUserEdit() {
$.ajax({
type: 'POST',
url: '#Url.Action("EditUser")',
dataType: 'json',
data: ,
success: function (run) {
console.log('Ok');
},
error: function () {
console.log('something went wrong - debug it!');
}
});
}
Controller:
[HttpPost]
public JsonResult EditUser(int[] RightId)
{
var rights = db.Rights.Where(b => RightId.Contains(b.Id)).ToList();
//do something with rights
}
You can achieve it this way :
function PostFormUserEdit()
{
var arr = [];
$("#UserEdit input[type='hidden']").each(function (index, obj) {
arr.push(obj.val());
});
$.ajax({
type: 'POST',
url: '#Url.Action("EditUser")',
dataType: 'json',
data: arr , // or you can try data: JSON.stringify(arr)
success: function (run) {
console.log('Ok');
},
error: function () {
console.log('something went wrong - debug it!');
}
});
}
I've been trying to write a JavaScript program that returns Wikipedia search results. A few days ago, I got it to the point where I could see the item being searched for, as confirmed by the alert() method, but now when I call the same alert() method it just returns "undefined":
$("button").click(function(e){
var search =document.getElementById("test").innerHTML.value;
alert(search);
});
I swear that this is exactly what I had while it was working, so there must be some subtle issue elsewhere. Any help is appreciated, complete code below:
HTML:
Random
<section>
<form>
<br>
<div class="divid">
<input type="text" value='' id="test" >
<button >Search</button>
</div>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script>
JavaScript:
$(document).ready(function () {
$("button").click(function(e){
var search =document.getElementById("test").innerHTML.value;
alert(search);
});
var button = $('button');
var toSearch = '';
var searchUrl = "http://en.wikipedia.org/w/api.php"
var x="England";
input.autocomplete({
source: function (request, response) {
$.ajax({
url: searchUrl,
dataType: 'jsonp',
data: {
'action': "opensearch",
'format': "json",
'search': request.term
},
success: function (data) {
response(data[1]);
}
});
}
});
var playListURL = 'http://en.wikipedia.org/w/api.php?format=json&action=query&titles=India&prop=revisions&rvprop=content&callback=?';
$.getJSON(playListURL ,function(data) {
$.each(data.query.pages, function(i, item) {
//alert(item.title);
})
})
$.ajax({
//http://en.wikipedia.org/w/api.php?format=json&action=query&titles=India&prop=revisions&rvprop=content&callback=?
url: '//en.wikipedia.org/w/api.php',
data: { action: 'query', list: 'search', srsearch: "Carl Sagan", format: 'json' },
dataType: 'jsonp',
success:
function (x) {
//alert( x.query.search[0].title);
}
});
})
Use .innerHTML to get the html in a DOM element
Use .value to get the value of an input, textarea, or other form input
.innerHTML.value is not a thing.
If you are using jQuery, try this:
var search = $("#test").html();
alert(search);
i have two function one is for delete and another for update . My delete function is working correctly but when i have written update function that is not working . Also update not working.
Here is the view
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script>
$(document).ready(function()
{
$('table#delTable td button.delete').click(function()
{
if (confirm("Are you sure you want to delete this row?"))
{
var id = $(this).parent().parent().attr('id');
var parent = $(this).parent().parent();
$.ajax(
{
type: "POST",
url: "<?php echo base_url('Welcome/delete');?>",
data:'id='+id,
cache: false,
success: function()
{
parent.fadeOut('slow', function()
{$(this).remove();});
}
});
}
});
$('table#delTable tr:odd').css('background',' #FFFFFF');
});
function update(str){
var id=str;
var nm=$('#nm'+str).val();
var em=$('#em'+str).val();
var st=$('#st'+str).val();
var ph=$('#ph'+str).val();
var dp=$('#dp'+str).val();
var un=$('#un'+str).val();
var datas="id="+id+"&nm="+nm+"&em="+em+"&st="+st+"&ph="+ph+"&dp="+dp+"&un="+un;
$.ajax(
{
type: "POST",
url: "<?php echo base_url('Welcome/update');?>,
data:datas,
cache: false,
success: function(msg) {
alert(msg);
}
});
}
</script>
<button type="button" class="delete>Delete</button>
<button type="button" onclick="update(<?php echo $row['id']; ?>)">Save</button>
Controller
public function update(){
$id=$_POST['id'];
$userName=$_POST['nm'];
$tokens=explode("",$userName);
$fName=$tokens[0];
$lName=$tokens[1];
$userEmail=$_POST['em'];
$userUni=$_POST['un'];
$userState=$_POST['st'];
$userDept=$_POST['dp'];
$userPh=$_POST['ph'];
$array = array(
'first_name' => $fName,
'last_name' => $lName ,
'email' => $userEmail,
'phone_number' => $userPh,
'varsity_name' => $userUni,
'state' => $userState,
'dept_name'=> $userDept,
);
$this->load->model('Prime_Model');
$result=$this->Prime_Model->updateProfile($id,$array);
if($result){
return "Data has updated";
}
else{
return "Nothing";
}
}
You miss double quote after ?> below:
$.ajax({
type: "POST",
url: "<?php echo base_url('Welcome/update');?>", // here
data: datas,
cache: false,
success: function(msg) {
alert(msg);
}
});
I have the following code:
$.ajax({
type: 'POST',
url: urlData,
data: { OwnerId: ownerIdData, Text: textData },
success: function (data) {
$('#post-container').prepend(data);
},
error: function () {
}
});
Now I want to eval the scripts contained in the variable data in the success function.
How I do that ?
Thanks in advance.
EDIT
I have the following form:
<form class="new-post-form">
<textarea id="post-creation-text-input" name="Text" rows="10"> Write something ... </textarea>
<input type="hidden" value="#Model.OwnerId" id="post-creation-id-input"/>
<input type="submit" value="Post" id="post-creation-submit-input" />
<script type="text/javascript">
$('#post-creation-submit-input').click(function (event) {
event.preventDefault();
var textData = $('#post-creation-text-input').val();
var ownerIdData = $('#post-creation-id-input').val();
var urlData = '#Url.Action("Create", "Posts")';
$.ajax({
type: 'POST',
url: urlData,
data: { OwnerId: ownerIdData, Text: textData },
success: function (data) {
$('#post-container').prepend(data);
});
},
error: function () {
}
});
});
</script>
</form>
Now the ajax response is the following view:
#using Facebook.Presentation.Web.Utils
#model Facebook.Presentation.Web.ViewModels.Posts.PostViewModel
<div class="post" id ="last-post">
<h3>#Html.UserName(Model.Author)</h3>
<br/>
<div>
#Html.DisplayFor(model => model.Text)
</div>
<br/>
#{
Html.RenderPartial("_CommentsPartial", Model.Comments, new ViewDataDictionary { { "ActionName", "Comment" }, { "ControllerName", "Posts" } });
}
</div>
This response also contains scripts that must be evaluated.
Thanks again.
Use jQuery.getScript() function. Documentation: http://api.jquery.com/jQuery.getScript/