snippetcsharpMinor
Generate N pairs of checkboxes and N textboxes
Viewed 0 times
pairscheckboxesgenerateandtextboxes
Problem
I've written a piece of code, where a pair of checkboxes and a textbox are generated N amount of times. Depending on what's in the DB, the checkbox/textbox may have a default value or are left empty.
I've pasted the code below, could anyone take a look to see if I haven't created an abomination?
I know the copy/paste code is not that clean. The textbox could be filled in with a variabele, which could remain empty if the DB record is as well. But I don't know if that makes the code more 'readable' or if such a method works for the Checkbox as well.
I've pasted the code below, could anyone take a look to see if I haven't created an abomination?
@if (singleItem != null && singleItem.FolderRead)
{
}
else
{
}
@if (singleItem != null && singleItem.FolderWrite)
{
}
else
{
}
@if (singleItem != null && singleItem.ExpireDate != null)
{
}
else
{
}
I know the copy/paste code is not that clean. The textbox could be filled in with a variabele, which could remain empty if the DB record is as well. But I don't know if that makes the code more 'readable' or if such a method works for the Checkbox as well.
Solution
I would use the razor boolean attributes:
Going further, if item/singleitem are coming from an Enumerable, there is probably a better way to generate the Ids as well. Especially if you want them to post back into a nice object. Remove the classes, remove the onchange handler.
You could also use an EditorFor on the date and create your own template if you prefer that route.
Going further, if item/singleitem are coming from an Enumerable, there is probably a better way to generate the Ids as well. Especially if you want them to post back into a nice object. Remove the classes, remove the onchange handler.
@for(var i=0;i
@Html.CheckBoxFor(m=>m[i].FolderRead)
@Html.CheckBoxFor(m=>m[i].FolderWrite)
@Html.TextBoxFor(m=>m[i].ExpireDate,new{type="date"}) // HTML5 date w/datepicker for browsers that support it
}
#mytable td:first-child input { CHKreader styles here };
#mytable td:nth-child(2) input { CHKwriter styles here };
#mytable td:nth-child(3) input { datepick styles here };
/* Optionally use these instead
input[name*="FolderRead"] { CHKreader styles here };
input[name*="FolderWrite"] { CHKwriter styles here };
input[name*="ExpireDate"] { datepick styles here };
*/
$('#mytable').on("change","input",function(){
var folderid=$(this).closest("tr").data("something");
changePermissions(folderid);
});
You could also use an EditorFor on the date and create your own template if you prefer that route.
Code Snippets
<td>
<input type="checkbox" id="canRead_@item.SecureFolderID" class="CHKreader" onchange="changePermissions(@item.SecureFolderID)" checked="@(singleItem != null && singleItem.FolderRead)" />
</td>
<td>
<input type="checkbox" id="canWrite_@item.SecureFolderID" class="CHKwriter" onchange="changePermissions(@item.SecureFolderID)" checked="@(singleItem != null && singleItem.FolderWrite)" />
</td>
<td>
<input class="datepick" id="expDate_@item.SecureFolderID" onchange="changePermissions(@item.SecureFolderID)" value="@((singleItem != null && singleItem.ExpireDate != null)?singleItem.ExpireDate.Value.ToString("yyyy-MM-dd"):null)" />
</td>@for(var i=0;i<Model.Count;i++)
{
<tr data-something="@item.SecureFolderID">
<td>
@Html.CheckBoxFor(m=>m[i].FolderRead)
</td>
<td>
@Html.CheckBoxFor(m=>m[i].FolderWrite)
</td>
<td>
@Html.TextBoxFor(m=>m[i].ExpireDate,new{type="date"}) // HTML5 date w/datepicker for browsers that support it
</td>
</tr>
}
<style>
#mytable td:first-child input { CHKreader styles here };
#mytable td:nth-child(2) input { CHKwriter styles here };
#mytable td:nth-child(3) input { datepick styles here };
/* Optionally use these instead
input[name*="FolderRead"] { CHKreader styles here };
input[name*="FolderWrite"] { CHKwriter styles here };
input[name*="ExpireDate"] { datepick styles here };
*/
</style>
<script>
$('#mytable').on("change","input",function(){
var folderid=$(this).closest("tr").data("something");
changePermissions(folderid);
});
</script>Context
StackExchange Code Review Q#92039, answer score: 2
Revisions (0)
No revisions yet.