We Keep Coding

Display incremented count from database table ID using Ajax

I want to get the last ID from a database table and increment by 1, to be displayed in an Input or Label parameter of HTML.
Most tutorials display it in tables. Here is my code:
index.cshtml
<td>Trans Id</td>
<td><input id="tbTransID" type="text" /></td>
<script>
$(document).ready(function () {
$.ajax({
type: "GET",
url: "/CashAdvance/GetTransID",
data: "{}",
success: function (data) {
var s = data.TransID;
}$("#tbTransId").html(s);
}
});
});
</script>
CashAdvanceController
public ActionResult GetTransID()
{
AcctgContext db = new AcctgContext();
return Json(db.CATransactions.Select(x => new
{
TransID= x.TransID + 1
}).ToList(), JsonRequestBehavior.AllowGet);
}

You need to change your linq query in the controller as below:
public ActionResult GetTransID()
{
AcctgContext db = new AcctgContext();
return Json(db.CATransactions.OrderByDescending(i => i.TransID).Select(i=>new
{
TransID= x.TransID + 1
}).FirstOrDefault(), JsonRequestBehavior.AllowGet);
}
In your query, you are selecting list of values whereas you need only the max id to increment it.

C# - Jquery : Pass regular params and list<KeyPairValue<string, string>> with $.post from view to controller

I try to pass 'regular' parameters type from an ajax call ($.post) from a view to a controller which is supposed to receive those parameters plus a List>.
I need this List cause those parameters will be different from model.types, and the method in the controller dispatch all params in a switch case to private methods.
I tried several jquery objects builds, JSON.stringify, the array with indexes in the string (I know I can't name columns explicitly... part of my question) which always ends in the List> to null in the backend method.
The 'params' are visible in xhr debug, but the parameter _options is always null (ref controller method).
Here is my vars and my ajax call :
function initDocumentsPreviewsActions() {
$('.documents-list-preview-action').on('click', function () {
if (xhrPreviewLoad != undefined)
xhrPreviewLoad.abort();
$('#documents-preview').html('<div class="general-form-message-loader"></div>');
documentCurrentIndex = $(this).data('btnindex');
setDatatableRowActive();
var documentType = $(this).data('documenttype');
var adherentRessourceId = $(this).data('adherentressourceid');
var annee = $(this).data('annee');
var echeancier = $(this).data('echeancier');
var destinataireid = $(this).data('destinataireid');
var destinatairetypeid = $(this).data('destinatairetypeid');
var emetteurid = $(this).data('emetteurid');
var emetteurmandatid = $(this).data('emetteurmandatid');
var trimestres = $(this).data('trimestres');
var params = [
{ '_annee': '' + annee + '', '_echeancier': '' + echeancier + '', '_trimestres': '' + trimestres + '' }
];
xhrPreviewLoad = $.ajax({
url: '/Documents/PreviewDocumentSingle',
data: {
_documentType: documentType,
_adherentRessourceId: adherentRessourceId,
_annee: annee,
_destinataireId: destinataireid,
_destinataireType: destinatairetypeid,
_emetteurId: emetteurid,
_emetteurMandatId: emetteurmandatid,
_echeancier: echeancier,
_options: JSON.stringify(params)
},
dataType: 'json',
type: 'POST'
}).done(function (documentPartialView) {
$('#documents-preview').html('<img src="' + documentPartialView.src + '"/>');
xhrPreviewLoad = undefined;
});
});
}
xhd Parameters in Firefox debugger :
_documentType AppelCotisation
_adherentRessourceId 836
_annee 2018
_destinataireId 11
_destinataireType Syndicat
_emetteurId 16289
_emetteurMandatId 5986
_echeancier False
_options [{"_annee":"2018","_echeancier":"False","_trimestres":"undefined"}]
Controller method :
[HttpPost]
public JsonResult PreviewDocumentSingle(string _documentType, int _adherentRessourceId, int _destinataireId, string _destinataireType, int _emetteurId, int _emetteurMandatId, List<KeyValuePair<string, string>> _options)
{
//(_options = null)
//some code
return JsonResult
}
I already have done this a long time ago but I cannot put a hand or my brain on it. I'm sure it's a little thing.
I expect to get ALL my parameters correctly or being suggested to declare another List of a different type in the backend (and how to formalize it in front), or Array... well... any help is good to come.
But I'd really like to keep mus ctor in the backend as it is.

I finally findout myself how to solve this simple problem by changing to a Dictionnaray instead of a List> in my controller's method parameters and build a simple js object like this :
var options = {};
options['_annee'] = annee;
options['_echeancier'] = echeancier;
options['_trimestres'] = trimestres;

Ajax call is passing controller name and method name instead of data

I am running into some trouble with my ajax call. Here is the controller code:
[Route("RatingInfo/HandleRequest")]
[HttpPost]
public ActionResult HandleRequest(Dictionary<string, string> textBoxValues)
{
var result = CreateJson(textBoxValues); // This is a simplified example
return Json(result);
}
And here is my Jquery/ajax (Razor syntax):
function PassData () {
var data = {};
$('.divCell input').each(function (index, item) {
var id = $(item).attr('id');
var value = item.value;
data['dictionary[' + index + '].Key'] = id;
data['dictionary[' + index + '].Value'] = value;
});
$.ajax({
url: '#Url.Action("HandleRequest")',
type: 'POST',
dataType: 'JSON',
traditional: true,
data: data,
sucesss: function (result) {
alert('Success');
}
})
}
The idea here is to get the data from each textbox and pass it back to the server as a Dictionary with the id as the key and value as, well, the value.
Stepping through the Chrome debugger, the JS data object is built successfully.
From the debugger:
Local
data: Object
dictionary[0].Key: "Address"
dictionary[0].Value: "123 Main St"
dictionary[1].Key: "ZipCode"
dictionary[1].Value: "99999"
dictionary[2].Key: "Phone1"
dictionary[2].Value: "(555) 555-5555"
...
__proto__: Object
However, when the data is passed back to the controller, the values inside textBoxValues does not contain the passed data. Rather, it contains two key/value pairs with keys controller and action and values the names of the controller and action.
From the Visual Studio debugger:
textBoxValues = Count = 2
[0] = {[controller, RatingInfo]}
[1] = {[action, HandleRequest]}
How can I get Jquery to pass the data rather than the controller/action names? I am confused as to how this can even happen in the first place. Any help would be appreciated.

UPDATE
Sorry, I had put wrong code in.
The reason why this was not working is because the name of the parameter was incorrect, giving you a mismatch.
The below will work for you. Notice the name of dictionary is changed to your parameter textBoxValues:
function PassData() {
var data = {};
$('.divCell input').each(function (index, item) {
var id = $(item).attr('id');
var value = item.value;
data['textBoxValues[' + index + '].Key'] = id;
data['textBoxValues[' + index + '].Value'] = value;
});
$.ajax({
url: '#Url.Action("HandleRequest")',
type: 'POST',
traditional: true,
data: data,
sucesss: function (result) {
alert('Success');
}
})
}

How can I modify this Select2 javascript to enable paging?

I am not too familiar with javascript, so I need help here. I have this method which returns a list of Customers (2000+), so the Select2 dropdown hangs. I want to enable paging, but I am not sure what I need to change. Here is my javascript code:
var GetCutomerDDL = function(cient) {
var Json = {},
customers = [];
$ddlCustomers.select2('val', '');
Json.client = cient;
$.post(urlContent + 'Cutomer/GetCustomerDDL', Json, function(data) {
}, 'json').done(function(data) {
customers = data;
$ddlCustomers.select2({
placeholder: "Select Customer(s)",
allowClear: true,
multiple: true,
data: customers
});
});
};
GetCustomerDDL uses LINQ to just return all the customers, but I want to enable paging so don't load over 2000 records in a dropdown at once. What do I need to change in the javascript and the server side?

The Select2 control includes "infinite scrolling". That may be what you're looking for.
Scroll2's main page is found here: http://select2.github.io/
On the server-side, you'll want to use Skip() and Take() LINQ operators to skip forward in the data and to take only a certain number of items from your data. Select2 should pass which items to skip and take to your controller.
Edit:
Try changing this:
$.post(urlContent + 'Cutomer/GetCustomerDDL', Json, function(data) {
}, 'json').done(function(data) {
customers = data;
$ddlCustomers.select2({
placeholder: "Select Customer(s)",
allowClear: true,
multiple: true,
data: customers
});
});
to this:
$ddlCustomers.select2({
ajax: {
url: urlContent + 'Cutomer/GetCustomerDDL',
dataType: 'json',
data: function (term, page) {
return {
q: term, // search term
pageLimit: 10,
page: page, // page number
client: client
};
},
results: function (data, page) {
var more = (page * 10) < data.total; // whether or not there are more results available
return { results: data.customers, more: more };
}
},
});
On your controller, you'll want to return your sub-list of customers in a "customers" property, and the total customers in a "total" property.
return Json(new { customers = customers.Skip(...).Take(...),
total = customers.Count() }, JsonRequestBehavior.AllowGet);
Sample json result:
{ customers: [...], total: 2000 }

asp.net mvc3 return multiple json list

Im asp.net mvc3 c# code returns json list like this:
return Json(new { name = UserNames, imageUrl = ImageUrls });
UserNames and ImageUrls are both List<string> types
And this is my javascript
function StartSearch(text) {
$.ajax({
url: '/Shared/Search',
type: 'POST',
data: { SearchText: text },
dataType: 'json',
success: function (result) {
$.each(result, function (i, item) {
alert(result[i].name);
});
}
});
}
How I can get names and ImageUrls?
Thanks

Access name as a property of result like this result.name[i]
Essentially, result will contain name and imageUrl which are both arrays, just like you have defined in your anonymous type, so your code should be modified like this to display an alert for each name in the name array
function StartSearch(text) {
$.ajax({
url: '/Shared/Search',
type: 'POST',
data: { SearchText: text },
dataType: 'json',
success: function (result) {
$.each(result.name, function (i, item) {
alert(item);
});
}
});
}
as $each iterates over the items in the name array, it will pass the item to the second parameter of your call back, i.e. item.
so
$.each(result.name, function (i, item) {
alert(item);
});
will popup each name.
Notes:
You may want to change the properties on your anonymous type to reflect that they are a collection:
return Json(new { UserNames = UserNames, ImageUrls = ImageUrls });
this way it will make more sense when you iterate over them in your success function.
As AlfalfaStrange pointed out, I didn't demonstrate how you might access both arrays. Which made me think, what is the relationship between user names and image urls?
Is this a list of images for a user? Maybe what you should consider is creating a specific model for this. For instance, UserDisplayModel:
public class UserDisplayModel
{
public string UserName {get;set;}
public string ImageUrl {get;set;}
}
In your controller return a list of UserDisplayModels. If this is the case, you'll have to rethink why they are two separate lists in the first place. Maybe ImageUrl should be a field on the User table.
So now, when you're returning a single list, e.g.
List<UserDisplayModel> users = //get users from db
return Json(new { Users = Users});
you can iterate them in one go in js code:
$.each(result.Users, function (i, item) {
alert(item.Name);
alert(item.ImageUrl);
});

This alerts the value of Name from each record of each list.
$.each(result, function (i, item) {
for (var x = 0; x < result.FirstList.length; x++) {
alert(result.FirstList[x].Name);
alert(result.SecondList[x].Name);
}
});
This assumes your Json response if formed correctly. Like this:
return Json(new { FirstList = results, SecondList = otherResults }, JsonRequestBehavior.AllowGet);
But as a side note, I see other problems with your code that you need to address
You're actually not performing a POST, you're searching based on input. Change POST to GET in your Ajax call
Change your action return line to allow for the get and make sure your are returning a JsonResult.
Naming conventions for C# method parameters call for Pascal-casing. Use a lowercase letter for first character
public JsonResult Search(string searchText) {
....
return Json(new { name = UserNames, imageUrl = ImageUrls }, JsonRequestBehavior.AllowGet);
}