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;
}
},
});
};
Related
BLADE FILE
<td><button class="deleteuser" data-id="{{ $user->id }}" data-token="{{ csrf_token() }}" >DELETE</button>
</td>
AJAX
$(document).ready( function () {
$(".deleteuser").click(function(){
var id = $(this).data("id");
var token = $(this).data("token");
$.ajax(
{
url: "user/delete/"+id,
type: 'DELETE',
dataType: "JSON",
data: {
"id": id,
"_method": 'DELETE',
"_token": token,
},
success: function ()
{
console.log("it Work");
}
});
console.log("It failed");
});
});
CONTROLLER
public function destroyuser($id){
$this->authorize('Admin');
User::find($id)->delete($id);
return response()->json([
'success' => 'Record has been deleted successfully!'
]);
return view('viewuser');
}
If I click on delete button, there is no response. Any suggestion or correction will be appreciated. Thanks in advance
I don't know if the JS is in a different file but to check if the "$( document ).ready()" is working add a console.log() call at the beginning.
$(document).ready( function () {console.log("document is ready")
$(".deleteuser").click(function(){
Refresh the page and check if "document is ready" is logged to the console.
If it isn't then the javascript is not loading
Check if the route is properly defined
You can replace your url as this and check:
var id = data.id;
var url = "{{route('your_route',":id") }}";
url = url.replace(':id', id);
pass url in your ajax url param
Or make above changes:
BLADE FILE
<td>
<button style="background-color: red;" onclick="clickOffConfirmed" title="Delete" class="btn btn-sm btn-clean btn-icon btn-icon-md delete"><i class="la la-trash" style="color: white;"></i></button>
</td>
SCRIPT
<script>
$(document).ready(function() {
$(document).on('click', '.delete', function ()
{
var obj = $(this);
var id=$(this).closest('td').find(".delete_id").val();
var result = confirm("Are you sure want to delete?");
if(result)
{
$.ajax(
{
type: "POST",
url: "{{route('delete_method')}}",
data: {
'_token': $('input[name="_token"]').val(),
'id': id
},
cache: false,
success: function (data)
{
if (data.status === 'success')
{
window.location = "{{route('redirect_route')}}";
toastr["success"]("Deleted Successfully", "Success");
}
else if (data.status === 'error')
{
location.reload();
toastr["error"]("Something went wrong", "Opps");
}
}
});
}
});
});
</script>
Controller
public function delete_method(Request $request)
{
$del = ModelName::findOrFail($request->id)->delete();
if($del)
{
return response()->json(['status' => 'success']);
}
else{
return response()->json(['status' => 'error']);
}
}
Route
Route::post('/test/delete','TestController#delete_method')->name('delete_method');
In your ajax codes, change this:
url: "user/delete/"+id,
To:
url: "{{ url('user/delete') }}/" + id
If your ajax codes are inside of your blade file also you can use this way:
url: "{{ route('YOUR_ROUTE_NAME', $user->id) }}/"
You incorrectly define delete function!
change
User::find($id)->delete($id);
To
User::find($id)->delete();
I need to send AJAX request using link.
<a href="#" class="messages_close">
<i class="far fa-window-close"></i>
</a>
May be construction like this?
<?php
$js = <<<JS
$(".messages_close").click(function () {
var id = 8;
$.ajax({
url: "'.\yii\helpers\Url::toRoute(['messages/exclude','id'=>8]).'",
type: "get",
data: "id="+this.id,
success: function(){
alert('SUCCESS');
},
error: function () {
alert('ERROR :: ' + 'id=' + this.id);
}
});
});
JS;
$this->registerJs($js);
Is it possible? Thank you
UPDATE 1
Thanks for #vvpanchev and #Serghei Leonenco
I did some changes:
added use yii\helpers\Url and changed url:;
removed data: "id="+this.id
removed var id = 8 it used in URL
I still get ERROR alert! ((
How can I get SUCCESS, or better return message from controller?
Here is my code looks like:
view\messages.php
<?php
use yii\helpers\Url;
?>
...
<a href="#" class="messages_close">
<i class="far fa-window-close"></i>
</a>
...
<?php
$js = <<<JS
$(".messages_close").click(function () {
$.ajax({
url: "' . Url::toRoute(['messages/exclude','id'=>8]) . '",
type: "get",
success: function(){
alert('SUCCESS');
},
error: function () {
alert('ERROR');
}
});
});
JS;
$this->registerJs($js);
MessageController.php (it opens in browser without problem)
<?php
namespace app\controllers;
use Yii;
use app\models\MessagesUsers;
use yii\web\Controller;
class MessagesController extends Controller
{
public function actionExclude($id)
{
return 'Success ID=' . $id;
}
}
Thank you for your help!
SOLUTION
<?php
$url = Url::toRoute(['messages/exclude']);
$js = <<<JS
$(".messages_close").on('click', function () {
$.ajax({
url: "{$url}",
data: {id: 8},
type: "get",
success: function(){
alert('SUCCESS');
},
error: function () {
alert('ERROR');
}
});
});
JS;
$this->registerJs($js);
<?php
$url = Url::toRoute(['messages/exclude']);
$js = <<<JS
$(".messages_close").on('click', function () {
$.ajax({
url: "{$url}",
data: {id: 8},
type: "get",
success: function(){
alert('SUCCESS');
},
error: function () {
alert('ERROR');
}
});
});
JS;
$this->registerJs($js);
i'm new on AngularJS and i spent hours trying ti figure out what wrong whith my code...
var articles = angular.module('Articles', []).config(function($interpolateProvider){
$interpolateProvider.startSymbol('{§').endSymbol('§}');
});
articles.controller('CommentsCtrl', ['$scope', '$http', function($scope, $http) {
this.comments = [];
this.showComments = function (index) {
$http({
method: 'POST',
url: '{{ path ('backend_article_commentaires')}}',
data: {articleID:index}
})
.success(function (data, status, headers, config) {
comments = data;
})
.error(function (data, status, headers, config) {
console.log(data)
});
}
}]);
the problem is that the comments variable dont change...
please how can i solve this ?
Update:
<div class="md-modal md-effect-13" id="modal-comments"
ng-controller="CommentsCtrl as ctrl">
<div class="md-content">
<h3>
<i class="fa fa-comments"></i> Tous les commentaires
</h3>
<div>
<div id="list-comment">
<h4>Cet article n'a aucun commentaires...</h4>
<li ng-repeat="comment in ctrl.comments" class="media">
<a>{{ comment.title }}</a>
</li>
</div>
<div class="button-row">
<button class="btn btn-danger md-close md-yes">Fermer</button>
</div>
</div>
</div>
</div>
Your problem is one of scopes (and not angular scopes) the this in your success function would not be the same as your this in your controller. If you assign "this" to a variable in the controller and then reference that you should be good to go.
articles.controller('CommentsCtrl', ['$scope', '$http', function($scope, $http) {
this.comments = [];
var rootThis = this;
this.showComments = function (index) {
$http({
method: 'POST',
url: '{{ path ('backend_article_commentaires')}}',
data: {articleID:index}
})
.success(function (data, status, headers, config) {
rootThis.comments = data;
})
.error(function (data, status, headers, config) {
console.log(data)
});
}
}]);
As you can see I created a rootThis variable to hold the "this" that way I can use it in the success function
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
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>