I've known many ways to limit the characters inputed inside the Textbox control or Freetextbox control.
How can I limit the character in each line (row) of FreeTextBox control???
For example, if the character in a line is 200, then it auto go to the next line
Best regard!
Hello this tricky way to handle by Javascript or JQuery..
Please follow below code for same with Jquery
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<asp:TextBox ID="txtData" CssClass="text-limit" runat="server" TextMode="MultiLine" style="width:500px; height:150px;"></asp:TextBox>
<script type="text/javascript">
var charactorPerLine = 20;
$(function () {
$(".text-limit").keydown(function (event) {
// Allow: backspace(8), delete(46), tab(9), escape(27) and enter(13)
if ($.inArray(event.keyCode, [46, 8, 9, 27, 13]) !== -1 ||
// Allow: Ctrl+A
(event.keyCode == 65 && event.ctrlKey === true) ||
// Allow: home, end, left, right
(event.keyCode >= 35 && event.keyCode <= 39)) {
// let it happen, don't do anything
return;
}
else {
if ($(this).val().lastIndexOf("\n") == -1) {
if ($(this).val().length >= charactorPerLine) {
$(this).val($(this).val() + "\n");
}
}
else {
if (($(this).val().length - $(this).val().lastIndexOf("\n")) >= charactorPerLine {
$(this).val($(this).val() + "\n");
}
}
}
});
});
</script>
Related
I'm using an UpdatePanel and the form auto-saves after every onTextChanged trigger. However, the page keeps going to the top. How do i keep the page where the onfocus is?
I'm currently using the MaintainScrollPositionOnPostback="true" but that's not working:
<%# Page Title="Welcome" Language="C#" MasterPageFile="account-master.master"
AutoEventWireup="true"
CodeFile="Welcome.aspx.cs"
Inherits="Welcome"
MaintainScrollPositionOnPostback="true"
%>
I used the following javascript code to fix this issue:
'window.onscroll = function () {
var scrollY = document.body.scrollTop;
if (scrollY == 0) {
if (window.pageYOffset) {
scrollY = window.pageYOffset;
}
else {
scrollY = (document.body.parentElement) ? document.body.parentElement.scrollTop : 0;
}
}
if (scrollY > 0) {
var input = document.getElementById("scrollY");
if (input == null) {
input = document.createElement("input");
input.setAttribute("type", "hidden");
input.setAttribute("id", "scrollY");
input.setAttribute("name", "scrollY");
document.forms[0].appendChild(input);
}
input.value = scrollY;
}
};'
This seemed to work. runs on windowload
window.onload = function () {
var scrollY = parseInt('<%=Request.Form["scrollY"] %>');
if (!isNaN(scrollY)) {
window.scrollTo(0, scrollY);
}
};
window.onscroll = function () {
var scrollY = document.body.scrollTop;
if (scrollY == 0) {
if (window.pageYOffset) {
scrollY = window.pageYOffset;
}
else {
scrollY = (document.body.parentElement) ? document.body.parentElement.scrollTop : 0;
}
}
if (scrollY > 0) {
var input = document.getElementById("scrollY");
if (input == null) {
input = document.createElement("input");
input.setAttribute("type", "hidden");
input.setAttribute("id", "scrollY");
input.setAttribute("name", "scrollY");
document.forms[0].appendChild(input);
}
input.value = scrollY;
}
};
I have a datagrid with date range filter (FilterOperations.Between) for date column
x.AddFor(m => m.RequestDate)
.Caption("Дата запроса")
.Width(150)
.Alignment(HorizontalAlignment.Center)
.DataType(GridColumnDataType.Date)
.Format("dd.MM.yyyy")
.FilterOperations(new[] {FilterOperations.Between})
.SelectedFilterOperation(FilterOperations.Between)
.AllowHeaderFiltering(false)
.FilterValue(new object[] {
DateTime.Now.AddMonths(-3),
DateTime.Now
});
How to make custom validation for filter values?
I want user to fill two fields in range filter or neither.
For example: If user fill only one field in range filter - show error message, If user fill two or neither fields in range filter - it's Ok.
Any ideas?
Finally I find out how to make custom validation
I made it with OnEditorPreparing event handler
cshtml:
.OnEditorPreparing("onEditorPreparing")
js:
function onEditorPreparing(e) {
if (e.editorName === "dxDateBox") {
prepareDateFilterCustomValidation(e);
}
}
function prepareDateFilterCustomValidation(e) {
e.editorOptions.onValueChanged = $.proxy(function () {
// Get Date inputs
var firstInput = $("div.dx-editor-container.dx-datagrid-filter-range-start > div > div .dx-texteditor-input").last()[0];
var secondInput = $("div.dx-editor-container.dx-datagrid-filter-range-end > div > div .dx-texteditor-input").last()[0];
validateDateInputs(firstInput, secondInput);
applyInputFilter(firstInput, secondInput, arguments[0]);
}, null, e.dataField);
}
function validateDateInputs(firstInput, secondInput) {
// If two inputs are filled - date range is valid
if (firstInput.value !== "" && secondInput.value !== "" || firstInput.value === "" && secondInput.value === "") {
$("div.dx-editor-container.dx-datagrid-filter-range-start > div").last().removeClass("dx-invalid");
$("div.dx-editor-container.dx-datagrid-filter-range-end > div").last().removeClass("dx-invalid");
return;
}
// If filled only first - date range is invalid
if (firstInput.value !== "" && secondInput.value === "") {
$("div.dx-editor-container.dx-datagrid-filter-range-start > div").last().removeClass("dx-invalid");
$("div.dx-editor-container.dx-datagrid-filter-range-end > div").last().addClass("dx-invalid");
return;
}
// If filled only second - date range is invalid
if (firstInput.value === "" && secondInput.value !== "") {
$("div.dx-editor-container.dx-datagrid-filter-range-start > div").last().addClass("dx-invalid");
$("div.dx-editor-container.dx-datagrid-filter-range-end > div").last().removeClass("dx-invalid");
return;
}
}
function applyInputFilter(firstInput, secondInput, filtrationFieldName) {
// If two inputs filled
if (firstInput.value !== "" && secondInput.value !== "") {
// change date format dd.mm.yyyy -> mm-dd-yyyy
var firstDate = new Date(
firstInput.value.substr(3, 2) + "-" + // Месяц
firstInput.value.substr(0, 2) + "-" + // День
firstInput.value.substr(6, 4)); // Год
// change date format dd.mm.yyyy -> mm-dd-yyyy
var secondDate = new Date(
secondInput.value.substr(3, 2) + "-" + // Месяц
secondInput.value.substr(0, 2) + "-" + // День
secondInput.value.substr(6, 4)); // Год
// apply datagrid filter
setColumnFilterValue(filtrationFieldName, [firstDate, secondDate]);
}
}
I've got an asp image in a repeater control, and I used the marked answer found here to get it so it links to the actual file:
Asp:Image with Link
Specifically, I surrounded it by an asp:hyperlink:
<asp:hyperlink id="link" runat="server">
<asp:image id="img" runat="server" imageurl="..." />
</asp:hyperlink>
This solution worked perfectly. However, when I tried to click on the link in IE, it immediately downloaded the image and then prompted me with options at the bottom to open or save the file.
Is there any way to have that hyperlink just open the image on a new page?
If you can use js:
<asp:HyperLink ID="link" runat="server">
<asp:Image ID="img" runat="server"
ImageUrl="~/images/app/your-img.png"
onclick="openWinPopUp(this.src)" />
</asp:HyperLink>
<script>
function openWinPopUp(URL, w, h, t, l) {
var wdh = (w == null || w == "" || w == "undefined") ? 250 : w;
var hgh = (h == null || h == "" || h == "undefined") ? 160 : h;
var tp = (t == null || t == "" || t == "undefined") ? 200 : t;
var lft = (l == null || l == "" || l == "undefined") ? 100 : l;
window.open(URL, "blank", "toolbar=no,location=no,directories=no," +
"status=no,menubar=no,scrollbars=yes," +
"resizable=no,copyhistory=no," +
"width=" + wdh + ", height=" + hgh + ", left =" + lft + "," +
"top = " + tp + ";");
}
</script>
Tested on MS Edge.
Am using an editable HTML datatable on my asp.net web page .Which look like this,
How to add validation on column Target, to receive only float values.?
Function (For enable edit):
function editRow(oTable, nRow) {
var aData = oTable.fnGetData(nRow);
var jqTds = $('>td', nRow);
jqTds[0].innerHTML = aData[0];
jqTds[1].innerHTML = aData[1];
jqTds[2].innerHTML = '<input type="text" id="Float" class="form-control" value="' + aData[2] + '">';
jqTds[3].innerHTML = '<a class="save-row" href="">Save</a>';
jqTds[4].innerHTML = '<a class="cancel-row" href="">Cancel</a>';
}
I tried to add keypress event on the textbox , but its not working.!
$('#Float').keypress(function (event) {
if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57) && (event.which != 8)) {
event.preventDefault();
}
});
Am new to jquery so please help me solve this ?
Try:
onload =function(){
var ele = document.querySelectorAll('.number-only')[0];
ele.onkeypress = function(e) {
if(isNaN(this.value+""+String.fromCharCode(e.charCode)))
return false;
}
ele.onpaste = function(e){
e.preventDefault();
}
}
Note: Above code doesn't work for -ve values.
I have a textbox and i need to validate that it accepts only 1,1.5,2,2.5,3,3.5,...11.5
How to validate it.. pls tell the answer please.
$(document).on('keyup', '#Dia_Inch', function (e) {
Dia_Inch = $(this).val();
if (Dia_Inch.charAt(1) == ".") {
if (Dia_Inch.charAt(2) != "5") {
this.value = '';
$('#Dia_Inch').val("");
alert("Number must be between 0 and 11.5 If zero inches, must enter 0 Enter 1/2 inches as .5; -Ex. 3 and 1/2 inches entered as 3.5");
return false;
}
}
var val = isNumberInch(e);
if (val == false || Dia_Inch > 11.5) {
this.value = '';
$('#Dia_Inch').val("");
alert("Number must be between 0 and 11.5 If zero inches, must enter 0 Enter 1/2 inches as .5; -Ex. 3 and 1/2 inches entered as 3.5");
return false;
}
});
this my sample code.. but it wont be worked.
You can do this using jquery:
function validate(value){
var arr = [1,1.5,2,2.5,3,3.5,...11.5];
if($.inArray(value, arr) >= 0){
return true;
}
return false;
}
You'll have to modify this according to your needs.
Here is a fiddle: http://jsfiddle.net/5Cm2w/
Do not forget to update the array with your actual values.
This may solve your purpose.
$(function() {
$('button').on('click', function() {
var val = $.trim($('input[type="text"]').val());
if(val.length && $.isNumeric(val) && val.match(/^\d+(\.5{0,1})?$/)) {
alert('valid')
} else {
alert('invalid');
$.trim( $('input[type="text"]').val('') );
}
});
});
Demo
But if u want to allow up to 11.5 then
$(function() {
$('button').on('click', function() {
var val = $.trim($('input[type="text"]').val());
if(val.length && $.isNumeric(val) && val.match(/^[1-9]{1}[1]{0,1}(\.5{0,1})?$/)) {
alert('valid')
} else {
alert('invalid');
$.trim( $('input[type="text"]').val('') );
}
});
});
Demo