I'm trying to process batch delete request, so i deleted some rows from grid and i clicked on save changes button.
For example:
I deleted two items from grid, but after save changes click button i get only first item ID using:
console.log("delete id: " +options.data.id);
Delete request is processed two times but I get only one Id.
How i should to do batch delete in right way?
Thanks for any advice:
Here is example of delete method:
// DELETE FUNCTION
destroy: function (options) {
console.log("delete");
console.log(options.data);
// add data to request params
console.log("delete id: " +options.data.id);
// call the service
ApiService.doHttpRequest("POST", $rootScope.apiBaseUrl + "/location/delete", requestParams)
.success(function (data, status, headers, config) {
// successful data retrieval
console.log("request success, checking state");
console.log(data);
// sent status to global HTTP status service
var jsonResponse = ApiService.processReturnedHttpState(status);
console.log("Status response is " + jsonResponse.result);
// do something with data
switch (jsonResponse.result) {
case true:
options.success(data);
break;
case false:
growlNotifications.add($translate.instant('LIST_LOADING_ERROR'), 'error', $rootScope.notificationLifetime);
break;
}
})
.error(function (data, status, headers, config) {
var jsonResponse = ApiService.processReturnedHttpState(status);
console.log("Processing error with status " +status);
growlNotifications.add($translate.instant('PROCESSING_REQUEST_ERROR') + jsonResponse.message , 'error', $rootScope.notificationLifetime);
// hide loading spinner
kendo.ui.progress(gridView, false);
});
},
options is an array. Every time you select a row to delete the data gets populated in to the options array. So the clicked row is the last index of the options array. To get the selected row id you can simply do this.
var len = options.models.length;
var curr = options.models[len - 1];
var id = curr.Id;
Related
I know the problem is the order of execution, the scope fires async and loads the data after the rest of the code has been processed. I have a httpGET that gets the information from a web service and it's inside my Facebook share function when the user clicks the Facebook share button. But i tried adding a watch and .then with return promise in the httpget but both i could not get to work.
So the idea is the following: I have an CDImage that the user shares on facebook and i have another directory that holds promotional images for that same CD, not all of them so the httpGET checks if the promotionCDid exists if it exists the variable CDImage should be updated with the CDPromotionalURL instead of the standard url is get from CDImage so the user shares the Promotional image instead of the default CD cover.
So far the problem is that the CDImage does not change directly and console.log(CDImage) displays the CDCover the first time and when you click the button after several seconds the CDImage shows the CDPRomotionURL image.
var CDPromotionalImageUrl = "EMPTY";
$('#facebookshare').click(function () {
$scope.GetCDdata = function () {
$http({
method: 'Get',
url: "/GetCDPromotionImage?id_CD=" + promotionCDId,
})
.success(function (data, status, headers, config) {
$scope.CDdata = data;
CDPromotionalImage = $scope.CDdata[0].filename
$scope.CDPromotionalImageUrl = "https://website.com/" + CDPromotionalImage
})
.error(function (data, status, headers, config) {
$scope.message = 'Unexpected Error';
});
};
if (CDPromotionalImageUrl == "EMPTY") {
CDImage = CDImage;
} else {
CDImage = CDPromotionalImageUrl;
}
console.log(CDImage)
var $this = $(this);
var urlShare = (window.location.href);
var obj = {
method: 'share',
href: (urlShare),
picture: (CDImage),
title: 'The ' + CDName,
caption: "As heard on website.com",
description:(description)
};
function callback(response) {
//alert("Post ID: " + response['post_id']);
}
FB.ui(obj, callback);
});
$scope.GetCDdata();
Scoop...
I have a drop down list that might not display a particular option you're looking for. I added a button with pop up modal to type in a field you want to add to the drop down list. It functions perfectly, but I need to add an ajax postback method to refresh the list after the user hits enter. I don't want to refresh the whole page, just the list. any help?
Controller:
public ActionResult AddLeadSource()
{
return View();
}
[HttpPost]
public ActionResult AddLeadSource(string name)
{
LeadSource ls = new LeadSource();
ls.Name = name;
db.LeadSources.Add(ls);
db.SaveChanges();
return Json(new { success = true });
}
JS
<script>
$("#AddNew").change(function () {
var name = $("#Name").val();
// var order = $("#DisplayOrder").val();
$.ajax({
type: 'POST',
dataType: 'json',
cache: false,
url: '/Admin/LeadSource/AddLeadSource',
data: { name: name },
success: function (response) {
//alert("Success " + response.success);
$('#FollowUpNotes').kendoWindow('destroy');
// Refresh the DropDown <-- Heres where I need some help!
},
error: function (jqXHR, textStatus, errorThrown) {
alert('Error - ' + errorThrown);
}
});
});
In your success function of your Ajax call add this:
$("IdOfDropDownList").data("kendoDropDownList").dataSource.read();
In this way your dropdownlist will call the read function and reload all data. I assumed that your dropdownlist is binding throught read call.
I highly recommend looking at jQuery UI's autocomplete widget. That said,
$('#YourDropDownID option').remove(); //this will remove all option elements inside the <select id="YourDropDownID">
Then you just need to build new ones based on the response data,
for (var o in data) {
if (data[o].Value != undefined) {
$('#YourDropDownID').append('<option value="' + data[o].Value + '">' + ("" + data[o].Display) + '</option>');
}
}
I do this inside the .done() callback of my AJAX:
.done(function (data) {
//above code
}
Depending on the nature of the data you are sending back you may need to loop through it differently. Mine is an array of objects with a Value and Display properties (in my case, account numbers and account names).
//server side controller
var query = #"
Select
SubString([mn_no], 0, 6) As Value,
RTRIM([acct_desc]) As Display
From [some_table]";
return con.Query(query, new { AccountNumber = accounts.Select(x =>
{
return new { Value = x.Value, Display = x.Display };
});
I have a list of events that gets build from a JSON call to my server. The list gets parsed through ng-repeat. I want to implement a like button for the event and if its liked, replace that with unlike.
<a ng-show='event.liked==null' ng-click="like(event.event_id)">Like</a>
<a ng-show='event.liked!=null' ng-click="unLike(event.event_id)">Unlike</a>
Everything works perfectly except I have to refresh the feed to show "Unlike". Is there a way I can update the specific list item at the index that was liked once clicked without the need to refresh.
Please let me know if you need more information. Thanks!
edit: adding like function & unlike function. All it does is send request to my server to like or unlike a specific event with the event_id and user token.
$scope.like = function (event_id) {
var url = www.server.com?type=unlike&event_id=...
$http.post(url).success(function (data) {
console.log('success like');
//I want it to update my index here
}).error(function (data) {
console.log('fail like');
});
};
$scope.unLike = function (event_id) {
var url = www.server.com?type=unlike&event_id=...
$http.post(url).success(function (data) {
console.log('success unlike');
//I want it to update my index here
}).error(function (data) {
console.log('fail unlike');
});
};
Instead of passing in the event_id, pass the object to the like and unLike functions and update the object in success handler.
HTML
<a ng-hide='event.liked' ng-click="like(event)">Like</a>
<a ng-show='event.liked' ng-click="unLike(event)">Unlike</a>
Controller
$scope.like = function(event) {
var url = 'www.server.com?type=unlike&event_id=' + event.event_id;
$http.post(url).success(function (data) {
event.liked = true;
console.log('success like');
}).error(function (data) {
console.log('fail like');
});
};
$scope.unLike = function(event) {
var url = 'www.server.com?type=unlike&event_id=' + event.event_id;
$http.post(url).success(function (data) {
event.liked = null;
console.log('success unlike');
}).error(function (data) {
console.log('fail unlike');
});
};
I'm stucked with this problem. I have a grid with a subgrid. When I edit a cell value of a column, my function goes through all subgrid rows and get's all values from that column and changes the value of a column of the parent row that opens this subgrid.
Here is my functions code:
function reloadGrid(rowid, dataResponse) {
$('#' + rowid).parent().trigger('reloadGrid');
}
function calculate(rowid, cellname, value, iRow, iCol) {
var id = $.jgrid.stripPref("_" + $.jgrid.stripPref(subGrid.getGridParam('idPrefix'), rowid), rowid);
id = $.jgrid.stripPref("s_", id);
var ids = subGrid.getDataIDs();
var result = 0.0;
for (var i = 0; i < ids.length; i++) {
result = result + parseFloat(subGrid.getCell(ids[i], 'value'));
}
grid.setCell(id, 'Total', result);
reloadGrid(rowid);
}
I tried to use this after setCell, but It seems to work only if you edited a cell, not if it's value changed automatically.
grid.saveRow(id, function(){alert("It works!");}, 'foo/edit.html?identifier=' + grid.getCell(id, 'identifier'));
What I want is to save the parent row that opens the subgrid after the cell has changed his value.
Thanks in advance.
PS: grid and subGrid variables are defined at the beginning of the JS. I think no need to explain what contains these variables...
UPDATE
Already solved, thanks anyway to all.
What I do is getting the row_id of the parent grid with $.jgrid.stripRef(...) in my current edited row. Using a function, every time I save my edited subgrid data I call that function that get all values from import column in my subgrid and sum them. After I get the total value, just have to do grid.editCell(row_id, 'total', sumResult), var data = grid.getRowData(row_id) and do an ajax call to the same URL where I send my edited data as if I do it via form:
$.ajax({
url: 'foo/edit.html?identifier=' + data.identifier,
type: 'PUT',
dataType: 'json',
contentType: 'application/json;charset=utf-8',
data: JSON.stringify(data),
success: null,
error: function(jqXHR, status, errorText) {
alert("HTTP Status code: " + jqXHR.status + "\nStatus text: "
+ status + "\nError: " + errorText);
}
});
That's what I wanted to do. I dont know if it is clear, but I have the solution. If someone don't understand something, just ask. ;)
jqGrid contains columns defined in colmodel as
{"name":"_actions",
"formatoptions":{"editbutton":true,"keys":true
,"delbutton":true
} },
{ "name":"Kood","editable":true,"hidden":true}
New row is added to grid pressing inline add button in toolbar.
After data in saved, controller returns new Kood column value.
This new value should assigned to Kood column.
Code below shows two methods which I tried but both fail. Kood column values does not change
How to update column after inline add ?
How to update column also if inline added row is saved using save action button ?
$grid.jqGrid('inlineNav', '#grid_toppager', {
addParams: {
addRowParams: {
keys: true,
// This is called if enter key is pressed to save added row
aftersavefunc: afterSaveFuncAfterAdd,
}
},
editParams: {
keys: true,
// This is called if saver button in toolbar is pressed on inline add
aftersavefunc: afterSaveFuncAfterAdd,
},
add: true,
edit: false,
save: true,
cancel: true
});
function afterSaveFuncAfterAdd(rowID, response ) {
var json = $.parseJSON(response.responseText);
postData = $grid.jqGrid('getGridParam', 'postData');
// this shows correct value:
alert(json.PrimaryKeyValues[0]);
// attempt 1:
$('#' + rowID + '_Kood').val(json.PrimaryKeyValues[0]);
// attempt2:
postData['Kood'] = json.PrimaryKeyValues[0];
}
The callback aftersavefunc of the editRow will be called after the and of editing. At the moment you will find no $('#' + rowID + '_Kood'). Moreover the postData will be not changed during inline editing so $grid.jqGrid('getGridParam', 'postData') will get you no helpful information.
So I recommend you to post back all the data which you need as the response from the editurl. For example the columns which have default values calculated by the server, like last editing timestamp, you can post back. The response of the Add operation should additionally contains the id generated by the server. You can use setRowData or setCell to modify the data in the grid after receiving the response from the server.
For example, You can return
{"Id": "DB_Id", "Kood": "new Kood value"}
from the server as the response on the "Add" operation and return
{"Kood": "new Kood value"}
as the response on the "Edit" operation. In the case the code of afterSaveFuncAfterAdd can be like the following
var afterSaveFunc = function (rowId, response) {
var data = $.parseJSON(response.responseText);
if ($.isPlainObject(data) && typeof data.Kood !== "undefined") {
if (typeof data.Id !== "undefined") {
// if we have 'Id' column in the grid we have to update the column
// together with the value of `Kood`
$(this).jqGrid('setRowData', rowId, { Id: data.Id, Kood: data.Kood });
// if we have no additional `Id` we can update the Kood column only with
// the statement like below
// $(this).jqGrid('setCell', rowId, 'Kood', data.Kood);
// in case of "Add" operation we have to update the row Id
$('#' + $.jgrid.jqID(rowId)).attr('id', data.Id);
} else {
$(this).jqGrid('setCell', rowId, 'Kood', data.Kood);
}
}
}