Monday 24 March 2014

JQuery Split Function in ASP.NET

In this article I will explain how to split the string using split function in JQuery with ASP.NET.

The split () method is used to split a string into an array of substrings, and returns the new array.

If you observe below script I used special character '-' to split string and assign the new string to new Textbox. If you want check this code in sample check below code

Example:

<script type="text/javascript">
        $(document).ready(function () {
            $('#btnCheckSplit').click(function () {
                var name = $('#txtSiteName').val();
                var arr = name.split('-');
                var sampletxt = '';

                for (var i = 0; i < arr.length; i++) {
                    sampletxt += arr[i];
                    sampletxt += ' ';
                }

                document.getElementById("<%= lblOutput.ClientID%>").value = sampletxt;
            })
        });
    </script>


Syntax:

string.split(separator,limit)

Properties:

Separator: Specifies the character, or the regular expression, to use for splitting the string. If omitted, the entire string will be returned.

Limit: An integer that specifies the number of splits, items after the split limit will not be included in the array.

Total Code:    

     Below is the total code. Check and let me know if any problem

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
 <title>Split function in JQuery</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#btnCheckSplit').click(function () {
var name = $('#txtSiteName').val();
var arr = name.split('-');
var sampletxt = '';
for (var i = 0; i < arr.length; i++) {
sampletxt += arr[i];
sampletxt += ' ';
}
document.getElementById("<%= lblOutput.ClientID%>").value = sampletxt;
})
});
 </script>
</head>
<body>
 <form id="form1" runat="server">
<table align="Center">
 <tr>
 <td colspan="2" style="font-size: x-large;" align="Center">
 <b>Split Function</b>
 </td>
 </tr>
 <tr>
 <td height="50px"><b>Enter Plit text Text:</b></td>
  <td>
  <asp:TextBox ID="txtSiteName" Width="250px" runat="server" Text="Satya-ASP.NET-Tutorial" />
 </td>
   </tr>
 <tr>
<td>
 <asp:Button ID="btnCheckSplit" runat="server" Text="Check Split Function in Jquery" /></td>
 </tr>
 <tr>
 <td height="30px"><b>Out put  :</b>
 </td>
   <td>
 <asp:TextBox ID="lblOutput" Width="250px" runat="server" /></td>
 </tr>
 </table>
</form>
</body>
</html>

Before:



After:

No comments:

Post a Comment