AJAX POST from a href class - ajax

I have a problem with my script. Why this AJAX don't do anything..
Thanks For help..
In body tag
<div class="share_playlist">
<a href="#" data-toggle="tooltip" title="add to playlist" class="plyshr" id="<?php echo $tracks['track_id']; ?>">
<img src="assets/img/ico/share_icon.png" width="28">
</a>
</div>
and AJAX
$(document).ready(function(){
$(".plyshr").click(function() {
var id = $(this).attr('id');
var dataString = 'id='+ id ;
var parent = $(this);
//alert (data);
$.ajax({
type: "POST",
url: "playlist.php",
success: function(html)
data: dataString,
cache: false,
success: function(html)
}).done(function( msg ) {
parent.html(html);
});
});
});
some more details
And in playlist.php
include 'connect.php';
session_start();
$ip=$_SESSION['id'];
if ($_POST['id'])
{
$id=$_POST['id'];
$ip_sql="insert into playlist (id_user, track_id) values ('$ip','$id')";
$list = mysql_query($ip_sql);
if(isset ($list)){
echo ("succes");
}
else
{
echo("failed");
}
}

you are having a syntax error in your javascript
success: function(html){
data: dataString,
there should be a brace

Related

post id with url using ajax

im write ajax code in post url and my userid bt not respond that code
<script>
function InviteLink( id, url ){
console.log(id);
$.ajax({
url: https://abc.hrm.com/auth/login
data: { 'id' : id },
success: function(data) {
}
});
}
</script>
<button onclick="InviteLink('<?php echo $employees->fldUserID; ?>','<?php echo base_url($employee_url); ?>');" style="background-color:#00C292; color:white; font-weight: bold; margin:5px 0px;" title="Invite New Employee" data-toggle="modal" data-target="#invitelink" type="button" class="btn btn-teal btn-circle"><i class="notika-icon notika-mail"></i></button>
**front UI in button i write onclick function and get id and url.... but there are not post in my url please help me solve my problem **
You Have to add method type = "POST" in ajax Like Below
<script>
function InviteLink( id, url ){
console.log(id);
$.ajax({
type: "POST",
url: https://abc.hrm.com/auth/login,
data: { 'id' : id },
success: function(data) {
}
});
}
</script>

Form validation in codeigniter when ajax used to form submit

Form submit is not happened in this scenario..
$.ajax({
type: "POST",
async: false,
url: base_url+"register/registration_val",
data: "register_first_name="+first_name,
success: function(data){
$('#inferiz').html(data);
},
error: function(){
alert('error');
}
In your view you can add this:
<script type="text/javascript">
var base_url = "<?php print base_url(); ?>";
</script>
Plus try to alert and see the value of final url in ajax i.e alert(url);
Try adding a id to the firstname input
<script type="text/javascript">
$(document).on('submit','#form-reg',function(){ // #form-reg is id on form open tag
$.ajax({
url: "<?php echo base_url('register/registration_val');?>",
type: 'POST',
data: {
firstname: $('#firstname').val(),
},
dataType: 'html', // I perfer to use json
success: function(data){
$('#inferiz').html(data);
},
error: function(){
alert('error');
}
}
});
});
</script>
I would use dataType: json much easier that way to get data from controller
You used data: "register_first_name="+first_name, it's not correct. Correction is data: {register_first_name:first_name},
base_url like this var base_url = <?php echo base_url(); ?>
So, Bellow final code :
<script type="text/javascript">
jQuery(document).ready(function ($) {
var base_url = <?php echo base_url(); ?>
$.ajax({
url: base_url+"register/registration_val", // Url to which the request is send
type: "POST", // Type of request to be send, called as method
data: {register_first_name:first_name}, // Data sent to server, a set of key/value pairs representing form fields and values
contentType: false, // The content type used when sending data to the server. Default is: "application/x-www-form-urlencoded"
}).done(function (data) {
$('#inferiz').html(data);
}).fail(function (data) {
console.log('failed');
});
}(jQuery));
</script>
Please verify your view part that whether you provided id same as in ajax function.
view part:
<form id="form-reg">
<input name="firstname" id="firstname" type="text" required placeholder="Enter firstname " >
<span id="name_validation" class="text-danger"></span>
<button name="submit" id="submit_button" onClick="myFunction();" >submit</button>
</form>
Then correct the base url path which has to be given inside php tag.
function myFunction() {
$.ajax({
url: "<?php echo base_url();?>register/registration_val",
type: "POST",
data:'firstname='+$("#firstname").val(),
success: function(msg)
{
alert('done..!');
}
});
}

Drupal AngularJS ajax simple ng-repeat update

i have problem replacing my ng-repeat
my html inside ng-app
<a href="#proceed" ng-click="order.submitOrderAjax()">
<?php print t('Finish order'); ?>
</a>
<ul>
<li ng-repeat="error in order.errors">{{ error.text }}</li>
</ul>
controller app.js
app.controller('orderController', function() {
this.errors = [];
this.submitOrderAjax = function(){
var data = {} // some data here like name, phone
jQuery.ajax({
type: 'POST',
url: Drupal.settings.basePath + 'ajax/submit_cart',
data: { 'order': data },
dataType: 'json',
success: function(response){
if(response.status == true){
var link = response.link.replace(/\\\//g, "/");
window.location.href = link;
}else{
this.errors = response.errors;
console.log(this.errors);
}
},
});
};
console.log returns what i need but ng-repeat is not updating
Actually html renders before response so you need render ng-repeat after response
<a href="#proceed" ng-click="order.submitOrderAjax()">
<?php print t('Finish order'); ?>
</a>
<ul ng-if="flag">
<li ng-repeat="error in order.errors">{{ error.text }}</li>
</ul>
Controller
app.controller('orderController', function($scope) {
this.errors = [];
$scope.flag=false;
this.submitOrderAjax = function(){
var data = {} // some data here like name, phone
jQuery.ajax({
type: 'POST',
url: Drupal.settings.basePath + 'ajax/submit_cart',
data: { 'order': data },
dataType: 'json',
success: function(response){
if(response.status == true){
var link = response.link.replace(/\\\//g, "/");
window.location.href = link;
}else{
this.errors = response.errors;
console.log(this.errors);
$scope.flag=true;
}
},
});
};

how to codeigniter ajax get data?

HTML
<div id="tabs">
<ul id="category">
<li><a href='#' class='cate' id='3'>3</a></li></br>
</ul>
</div>
Jquery
$(function() {
$(".cate").click(function()
{
var user_id = $(this).attr("id");
$.ajax({
type: "GET",
url: "<?php echo base_url('workplace/'.$username.'/menu') ?>",
data: user_id,
success: function(result){
$("#category-details").html(result);
}
});
});});
but in url is : localhost/project/workplace/test/menu?3
how to make : localhost/project/workplace/test/menu/3
Try replace
url: "<?php echo base_url('workplace/'.$username.'/menu') ?>",
this
url: "<?php echo base_url('workplace/'.$username.'/menu/') ?>" + user_id,
but it isn't best solution.
If you want to remove the ?3 from the URL, use a POST instead of a GET:
jQuery.ajax({
type: "POST",
url: "<?php echo base_url('workplace/'.$username.'/menu') ?>",
data: user_id,
error : function(result){
// Do something here to see what the problem is
// maybe console.log(result);
},
success : function(result){
$("#category-details").html(result);
}
});
This will make the URL localhost/project/workplace/test/menu/

Ajax retrieve data from success function

I am submitting a form via Ajax, and I want to prepend the project name to a list item when the form is submitted. Everything works fine except for pulling the information needed inside the success function. Data[Project][project_name] is being posted. How do I get the project name inside the success function? Right now "data" is being displayed in the list. I only have the one textbox in my form.
<script type="text/javascript">
$(document).ready(function () {
var frm = $('#ProjectAddForm');
frm.submit(function() {
$.ajax({
type: frm.attr('method'),
url: frm.attr('action'),
data: frm.serialize(),
success: function(data) {
$('#ProjectProjectName').val('');
$('#ProjectList').prepend("<li style='color: green;'>data</li>");
}
})
});
return false;
});
</script>
HTML:
<ul id="ProjectList">
<?php foreach ($projects as $project): ?>
<li><?php echo $project['Project']['project_name']; ?></li>
<?php endforeach; ?>
<?php unset($project); ?>
</ul>
<form accept-charset="utf-8" method="post" onsubmit="event.returnValue = false; return false;" id="ProjectAddForm" action="/callLog/projects/add">
I needed to add a dataType: 'json' to the request.
<script type="text/javascript">
$(document).ready(function () {
var frm = $('#ProjectAddForm');
frm.submit(function() {
$.ajax({
type: frm.attr('method'),
url: "<?php echo $this->Html->Url(array('controller' => 'projects', 'action' => 'add.json')); ?>",
data: frm.serialize(),
dataType: 'json',
success: function(data) {
$('#ProjectProjectName').val('');
$('#ProjectList').prepend("<li class='icon-remove', style='color: green;'>" + data.projectName + "</li>");
$('#modalProject').modal('hide');
}
})
});
return false;
});
</script>

Resources