How to dinamicly delete current <div> in for loop with jquery - c#

I need delete dinamicly div in my for loop, I try do that with jquery but it delete only "Delete" button but I need delete button and in div textbox and checkbox
this is my code
<div class="editorRow">
#for (int i = 0; i < Model.AnswerList.Count; i++)
{
#Html.TextBoxFor(x => x.AnswerList[i].Description)
#Html.CheckBoxFor(x => x.AnswerList[i].IS_Right, new { id = '1'})
delete
<script type="text/javascript">
$("a.deleteRow").click( function () {
$(this).click(".editorRow").remove();
return false;
});
</script>
}
</div>

Try
$("a.deleteRow").click( function () {
$(this).closest('.editorRow').remove();
return false;
});
Note you are giving all your checkboxes the same id attribute (that's invalid html)

Try This
$("a.deleteRow").click( function () {
$(this).parent('.editorRow').remove();
return false;
});

Related

Kendo UI Grid: show DetailTemplate with conditions

I want to show DetailTemplate for Kendo UI Grid by conditions.
I tried the following cases:
detailTemplate: '#if(ResultDate!= null){ =kendo.template($("#detailRequestTemplate").html()) }#',
and
detailTemplate: function (e) {
if (ResultDate != null)
{
return kendo.template($("#detailRequestTemplate").html());
}
},
both of them don't work correctly
Try putting this logic inside the template instead.
<div id="grid"></div>
<script type="text/x-kendo-template" id="detailRequestTemplate">
#if(ResultDate !== null) {#
//...your template html
#}#
</script>
<script>
$(document).ready(function() {
$("#grid").kendoGrid({
detailTemplate: kendo.template($("#detailRequestTemplate").html()),
});
});
</script>
For a more complete example, look at this dojo.
Also take a look at Telerik's Templates Overview documentation.
I found a solution for it:
dataBound: function (e) {
var items = e.sender.items();
items.each(function () {
var row = $(this);
var dataItem = e.sender.dataItem(row);
if (ResultDate !== null) {
row.find(".k-hierarchy-cell").html("");
}
})
},
This code removes an "arrow", if condition is false

Tab not loading the content onclick and opening only on double click

Am having a tab as below
<div id="tabs" style="width:1060px">
<ul>
<li>Overview</li>
<li>General Info</li>
<li>Dimension</li>
<li>Blocking</li>
<li>History</li>
</ul>
</div>
and the onclick method as below:
function ShowDetails() {
// $("#tabs").tabs("option", "selected", i);
var AccNum = $("#SelId").val();
if (AccNum != null && AccNum != "") {
var url = '/InventJournalGeneral/Details/' + AccNum;
window.open(url, "_self");
}
else {
alert('Choose any one Journal Id');
}
}
Only on double click of the tab am able to see the tab loaded and not on the single click. Also I suppose the tab which i click is not selected and it is always on the tab 0 .
You can try this:
HTML:
<li class="click">General Info</div>
JS:
$(function () {
$('body').on('click', function (evt) {
if($(evt.target).hasClass('click')){
alert("hello");
}
});
});

Search function using Jquery

i'm doing a search function on a gridview with Jquery
i am able to hide the grid when entering text in the search box but the code does not validate the text on the gridview making it not able to search the rows
my gridview is edited and can be selected to display a datalist so i'm not very sure how to make it work
$(document).ready(function () {
$('#<%=lblNoRecords1.ClientID%>').css('display','none');
$('#<%=Button2.ClientID%>').click(function(e){
$('#<%=lblNoRecords1.ClientID%>').css('display','none');
$("#<%=GridView1.ClientID%> ").hide();
var iCounter = 0;
var sSearchTerm = $('#<%=SearchBox1.ClientID%>').val();
if (sSearchTerm.length == 0){
$("#<%=GridView1.ClientID %> tr:has(td)").show();
return false;
}
$("<%=GridView1.ClientID%> tr:has(td)").children().each(function(){
cellText = $(this).text().toLowerCase();
if(cellText.indexOf(sSearchTerm.toLowerCase()) >=0){
$(this).parent().show();
iCounter++;
return true;
}
});
if(iCounter == 0)
{
$('#<%=lblNoRecords1.ClientID%>').css('display','');
}
e.preventDefault();
})
})
</script>

Editorfor checkbox field onclick

I have an editorfor field that is a checkbox and when it is changed from false to true and the form is submitted i need to track that the checkbox was changed and is marked true. Also it has to be a javascript or jquery function.
<div class="editor-field">
#Html.EditorFor(model => model.IsPublic)
</div>
If i need to explain this better please tell me. I just cant think of how else to explain.Thanks
Hope following code will do it:
#Html.HiddenFor(model => model.IsPublicChanged) #*create special model field for handling change event*#
$().ready(function () {
//catch change event and assign value to hidden field
$("input[name=IsPublic]").on("change", function () {
$("input[name=IsPublicChanged]").val('true');
});
});
Or some different js-code if you want to see if value of checkbox was changed comparing to it's initial value:
$().ready(function () {
var trackValue = $("input[name=IsPublic]").prop("checked");
$("form").on("submit", function () {
var actualValue = $("input[name=IsPublic]").prop("checked");
if (actualValue != trackValue) {
$("input[name=IsPublicChanged]").val('true');
}
});
});

How do I disable or enable 2nd dropdownlist in aspx based on selected choice of the 1st dropdownlist box

I am having a problem with disabling DropDownList based on the chice of 1st DropDownList, there is no post back occuring, and it is a template based web app here is the current code:
<script type="text/javascript">
$(function() { var dropDownList1 = $('#<%= ddlUserType.ClientID %>');
var dropDownList2 = $('#<%= ddlMember.ClientID %>'); dropDownList1.change(function(e) {
if ( jQuery("#ddlUserType").val() != "ETOC") dropDownList2.removeAttr('disabled'); e.preventDefault();
else
dropDownList2.removeAttr('enabled'); e.preventDefault(); }
} );
</script>
what is happening now is page is blank and if I remove the above code everything shows, where I am going wrong.
here is the plain and final javascript code which worked:
<script language="javascript">
function CheckDropDownState(lstbox)
{
if (lstbox.selectedIndex == 3) { document.forms[0].ddlMember.disabled = 1; }
else { document.forms[0].ddlMember.disabled = 0; }
}
</script>
and thew .aspx code:
<asp:dropdownlist id="ddlUserType" runat="server" onclick="CheckDropDownState(this);"></asp:dropdownlist>
Once again appreciate the help guys.
I've tried cleaning your code a little bit:
$(function() {
var dropDownList1 = $('#<%= ddlUserType.ClientID %>');
var dropDownList2 = $('#<%= ddlMember.ClientID %>');
dropDownList1.change(function(e) {
var selectedValue = $(this).val();
if (selectedValue != 'ETOC') {
// enable the second combo if the value selected in the first combo
// is not ETOC
dropDownList2.removeAttr('disabled');
} else {
dropDownList2.attr('disabled', 'disabled');
}
e.preventDefault();
}
});

Categories