I have cloned row form existing row in a table,i have gave validations for first row using jquery.validate.unobtrusive but it is not working properly for cloned row
You can use jQuery in your view and validate for client site.
For example if you have table you can use scripts some like:
Before form submit you can use:
var filterTable = $('#tableID').find('tr').length;
if (filterTable != 1) {
CheckFilterNameField(); // Use function
}
This function
function CheckFilterNameField() {
var $namefield = $('.filterPanel tr .namefield');
$namefield.each(function () {
if ("your conditions")
$(this).addClass('error');
else
$(this).removeClass('error');
});
}
If you will be have class error on the element in your table page can't load and in the specific item for example will be red or you can show alert about error in your form.
Related
Parent form is the same I only change the company in the request and on some company i get parent form instead of sub form. So for example I have default company make a request get some form. According to user actions I change company in form request( but it is the same form name).
After that I try to get some sub form and on one particular company/form get the parent sub form instead of a child.
I already read topic about the problem that looks the same, but get rows and set active rows doesn't help me.
Do somebody had this problem?
async getDocuments(formName: string, getMappedRows: Function) {
const _currentOrderType = this.priorityService.getCurrentOrderType();
const _groupForm = await this.priorityService.getFormBridge(eSharedForm.GROUP.toString());
await _groupForm.setActiveRow(_currentOrderType.company.key);
const ListForm = await this.priorityService.getSubFormBridge(formName.toString(), _groupForm);
//some more logic
}
private async _getSubForm(name: string, form: any) {
try {
const subform = await form.startSubForm(name, this.onMessage, this.onUpdate);
debugger;
return subform;
} catch (e) {
this.subForms[name] = undefined;
const _e = JSON.stringify(e);
console.log(`[PriorityService::_getSubForm] Error starting subform '${name}': ${_e}`);
throw e;
}
}
and after that i see the same form as before
It is not clear from your code snippet what getSubFormBridge does or what is the value of _currentOrderType.company.key Is it numeric? is this the number of the row you want to retrieve?
When you start the Parent form, try to set autoRetrieveFirstRows to 1, which means, select the first row of the current form. If you know for sure what row you want to retrieve, pass the correct row number.
For example:
const form = await priority.formStart('ORDERS', this.onError, this.onSuccess, '', 1);
If you need to filter first and than select a row, use setActiveRow method and pass it the number of the row you want to retrieve. (Starts from 1)
Once the row is selected, retrieve the subform. For example:
const subform = await form.startSubForm("ORDERITEMS");
I have 2 lists in a view. What I want to do is that pick elements from list1 and update list2 with selected elements everytime I pick one. I tried to use PartialView (I don't know if it's correct approach or not) but I failed. I have a function in controller that fills a list by selected items. What needs to be done is updating the view dynamically. Can you suggest me a roadmap for this?
Update
I forgot to say that I have done this with javascript. But I feel like it's the long way when it comes to some validations (checking duplications etc.)
$(document).ready(function (){
$("#allPlayersList a").on("click", function () {
var options = $(this).clone();
$("#thisWeekList").append(options);
});
});
Just create an html list. See if this link helps. https://codepen.io/alexander-holman/pen/QNQrvz. You can also populate the values from database
Then you can get the selected element by javascript like this
var input = document.getElementById('Something').value;
Update after edited question
You can try something like
var listSelection = document.getElementById('Something').value;
Now you can create an api in the backend which accepts this value and returns a list based on it. Call that Api like this
&.ajax({
url: //url of api
data: {exactNameOfApiParameter : listSelection },
success: function(data){
for (i = 0; i < data.length; i++) {
$('<li>', { text: data[i] }).appendTo($('#list2'));
}
}
})
Make sure that id of second list is list2.
I am using jquery sortable with table and it works fine.
When I use pagination (I save the new order of datatble items in the DB via ajax post) the table lose the order and the new order will appear only if I refresh the page (because I will get the entities from the DB)
How can I kepping the new order while using pagination ?
$("tbody").sortable({
axis:'y',
placeholder: "ui-state-highlight",
group: 'no-drop',
handle: '.drag',
update: function (event, ui) {
var videoSortedIDS = $(this).sortable("toArray");
var ranks = [];
for (r = pageInfo.start; r < pageInfo.end; r++) {
ranks.push(r);
}
$.post(urlSort, {videoIDS: videoSortedIDS, videoRanks: ranks}, function (data) {
if (data.responseCode === 200) {
console.log(data.sortedEntities);
} else {
alert("Error");
}
});
}
}).disableSelection();
I found a solution ! Since the jquery Sortable don't affect the object instanciated with Datatable, I update every row in the Datatable table with the new content of the html table:
table.row(index).data(newRowContent).draw(false);
draw(false) to save the page state ;)
I am currently doing a project in .net MVC4 and I have requirement to populate a Display field with current date, when a checkbox is ticked in the Edit form.
Since it's an edit form Checkbox, might be ticked already and I need to check if it's selected the first time then I need to populate the current date.
Update:
Matt Thanks..I got this around by using Hidden field.
Steps involved:
1. store the model field in Hidden field in your Edit Screen.
#Html.Hidden("hiddenDateField", Model.DateField)
#Html.Hidden("hiddenCheckBox", Model.CheckBoxField)
Then using JQuery I added following logic..
$('#chkBox').on('click', function () {
var myDate = new Date();
var displayDate = (myDate.getUTCDate()) + '/' +(myDate.getUTCMonth() + 1) + '/' + myDate.getUTCFullYear() + " " + myDate.getUTCHours() +":" + myDate.getUTCMinutes() +":"+myDate.getUTCSeconds();
if ($('#chkBox').is(":checked")) {
if ($('#hiddenCheckBox').val() == "False") { // This condition is to check if the user is selecting checkbox for 1st time by comparing with received model data value.
$('#lblDate').text(displayDate);
} else {
$('#lblDate').text($('#hiddenDateField').val()); // This condition is to restore the Date if user unticks and Select Checkbox again.
}
}
if (!$('#chkBox').is(":checked")) { // This when user unticks the checkbox and I replaced the date to empty char.
$('#lblDate').text("");
}
});
no need to use ajax, just use jquery. without your code it is hard to give an example so you will need to change this to match your code
$(document).ready(function(){
//this will check if checked on load and set the text box to now
if($('.chkClass').is(":checked")){
$('.txtClass').val($.now());
}
$('.chkClass').on('click', function(){
//check again so it only sets the date if they check and not uncheck
if($('.chkClass').is(":checked")){
$('.txtClass').val($.now());
}
});
});
I am using a jqgrid with a column named 'Comments'. My controller code returns data as follows:
var jsonData = new
{
rows=
....
....
select new
{
col1....
col2....
Comments = _Model.GetComments(id),
})
.......
.....
return Json(jsonData, JsonRequestBehavior.AllowGet);
}
_Model.GetComments(id) will return a ClientComments Object which has a few properties say CommentID, FirstName, MiddleName etc., which will be bound to each row in the grid
Now in my jqgrid I need to build a tool tip based on Comments column properties and for that I need to use the properties of my Comments in JQGrid for each row. May I know How I can manipulate Comment's properties for each row? Any help would be appreciated.
I tried in my javascript that for each row rowObject.Comments.FirstName and it did not work.
For the JavaScript version of the grid you would use getDataIDs to get the ID of each row, and then use getRowData to read the data at that row. For example:
var ids = $("#grid").getDataIDs();
for(var i=0; i<ids.length;i++){
var rowdata = $("#grid").getRowData(ids[i]);
// Build tooltip here using rowdata.FirstName, rowdata.MiddleName, etc.
}
But, are you working with the JavaScript version of jqGrid or jqGrid ASP.NET component?