Jquery Auto Complete in asp.net - asp.net

i want to use jquery ui auto complete plugin in asp.net.
this is my behind code :
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim locations As String() = New String() {"Las Vegas", "Los Angeles", "Tampa", "New York", "s", "sss"}
Dim jsArray As String = GetJSArrayForVBArray(locations)
Me.ClientScript.RegisterArrayDeclaration("usernames", jsArray)
End Sub
Private Function GetJSArrayForVBArray(ByVal vbArray As String()) As String
Dim myResult As New StringBuilder()
For Each item As String In vbArray
With myResult
.Append(",'" & item & "'")
End With
Next
If (myResult.Length > 0) Then
Return myResult.ToString().Substring(1)
Else
Return ""
End If
End Function
this is html code :
<script type="text/javascript">
$(function () {
var availableTags = new Array();
$("#tags").autocomplete({
source: availableTags
});
});
</script>
<label for="tags">Tags: </label>
<input id="tags" />
what is the problem?
it does not work.
when i filling array in aspx page it works but when i want to fill in behind code not.
thanks.

Try changing your JS to this:
<script type="text/javascript">
$(function () {
$("#tags").autocomplete({
source: usernames
});
});
</script>
If I'm guessing at your .Net code correctly, you're registering "usernames" as the javascript array, but trying to use the empty 'availableTags' as your autocomplete source.
Note: this may be completely off-base here - I haven't actually used ClientScript.RegisterArrayDeclaration or the jQuery autocomplete plugin in code I've written before.

Related

querystring missing value after postback

I'm using webcam.js to get photos from a webcam using asp.net web form app. The problem is, I want to get the filename based on the "ID" querystring. But everytime I click "shoot" button, the querystring value is nothing.
Here's my complete HTML :
<%# Page Language="vb" AutoEventWireup="false" CodeBehind="Coba.aspx.vb" Inherits="myWebcam.Coba" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src='<%=ResolveUrl("~/Plugin/jquery.webcam.js")%>' type="text/javascript"></script>
<script type="text/javascript">
var pageUrl = '<%=ResolveUrl("~/Coba.aspx")%>';
$(function (){
$("#Camera").webcam({
width: 320,
height: 240,
mode: "save",
swffile: '<%=ResolveUrl("Plugin/jscam.swf")%>',
onTick: function () { },
onSave: function () {
},
onCapture: function () {
webcam.save(pageUrl);
},
debug: function () { },
onLoad: function () { }
});
});
function Capture() {
webcam.capture();
return false;
};
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<h2>Index</h2>
<input type="button" value="Shoot!" onclick="Capture()" />
<div id="Camera"></div>
</div>
</form>
</body>
</html>
And here is my asp.net codebehind :
Imports System.IO
Imports System.Web.Services
Public Class Coba
Inherits System.Web.UI.Page
Public sID As String
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
sID = Request.QueryString("id")
If Not Page.IsPostBack Then
Capture(Trim(sID))
End If
End Sub
Public Sub Capture(ByVal mID As String)
Dim stream = Request.InputStream
Dim dump As String
If stream.Length > 0 Then
Using reader = New StreamReader(stream)
dump = reader.ReadToEnd()
End Using
Dim path = Server.MapPath("~/" & Trim(mID) & ".jpg")
System.IO.File.WriteAllBytes(path, String_To_Bytes2(dump))
End If
End Sub
Private Function String_To_Bytes2(strInput As String) As Byte()
Dim numBytes As Integer = (strInput.Length) / 2
Dim bytes As Byte() = New Byte(numBytes - 1) {}
For x As Integer = 0 To numBytes - 1
bytes(x) = Convert.ToByte(strInput.Substring(x * 2, 2), 16)
Next
Return bytes
End Function
End Class
The first time I run the page, I can get the "id" value from the querystring. The shoot button trigger the postback and run the "Capture" sub but the "id" querystring returns nothing.
Any solutions for this problem ?
I tried the code and I think there is a mistake concept. The plugin does not seem to append any QueryString. Your ID is always Nothing. I made debugging and found no trace of the addition ID in the QueryString.
The file name is an attribute that you assign yourself with your logic.
Here is a complete example in which the ID is not recovered.
Even in the official page of the plugin there is no reference to the ID through Querystring.
Other things, you should not use the same page for the interface and saving process. The Pageload is always called, and you call Capture(Trim(sID)) even when loads the interface.
I think you must change this line:
var pageUrl = '<%=ResolveUrl("~/Coba.aspx")%>';
In
var pageUrl = '<%=ResolveUrl("~/Coba_SaveImage.aspx")%>';
And all your codebehind go in the page Coba_SaveImage.aspx. In Page Load is not necessary the If Not Page.IsPostBack Then is always a postback.
Hope this help you.

disable radmenu button from javascript that is called from the vb.net page load function

I am trying to make it that on page load in the code behind, I disable a button in the radmenu using javascript
If I run my javascript in the console window in the browser to test then the button will disable. so that proofs that the JavaScript works.
the error is : cant find object - $find('myRadMenu') and the name is correct, so it has something todo with when the radmenu is rendered so I tried a wrap my script in a document.ready but that also won't work
'' not working with document.ready
' Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
' ClientScript.RegisterStartupScript(Me.GetType(), "test", "<script type='text/javascript'> $(document).ready(function(){$find('myRadMenu').findItemByText('MyButton').disable();}); </script>")
' End Sub
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
ClientScript.RegisterStartupScript(Me.GetType(), "test", "<script type='text/javascript'> $find('myRadMenu').findItemByText('MyButton').disable(); </script>")
End Sub
Do you know how to disable a radmenu button from javascript that is called from the vb.net page load function.
It must be done this way as I have other javascript that needs to fire
Please try with the below code snippet.
JS
function DisabelMenu(MenuText) {
setTimeout(function () { SetSettingAfterSometime(MenuText) }, 100);
}
function SetSettingAfterSometime(MenuText) {
var menu = $find("<%=RadMenu1.ClientID%>");
menu.findItemByText(MenuText).disable();
}
CS
RegisterStartupScript(this, this.GetType(), "test123", "DisabelMenu('test2');", true);
If you get the null then increase the timeout delay.

insertText into a CKEditor through Code Behind

I am trying to get CKEditor.NET to insert some text into my CKEditor when the page loads.
Private Sub CKEditor_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles myCKEditor.Load
Dim insertScript As String
insertScript = "<script type=""text/javascript"">window.CKEDITOR.instances.myWidget_myCKEditor.insertText(""test"");</script>"
Dim cManager As ClientScriptManager = Parent.Page.ClientScript
cManager.RegisterStartupScript(Me.GetType, "insertText", insertScript)
End Sub
My page is organized as follows:
myPage (aspx)
myWidget (ascx)
myCKEditor (from an assembly)
I am getting the following error:
TypeError: Cannot read property 'instances' of undefined
It appears that CKEDITOR is not around when this is called. If I open up the JS console and run the insertScript it works as desired.
I have tried attaching this routine to MyBase.Load and Me.Load as well to no avail, and even tried using window.Load = insertScript, all of which produce the same error.
I noticed that no matter what I do, the last thing in the source is the script that initializes CKEditor, ie
....
<script type="text/javascript">window.CKEDITOR.instances.myWidget_myCKEditor.insertText("test");</script>
<script type="text/javascript">
//<![CDATA[
window.CKEDITOR_BASEPATH = '/ckeditor/';
//]]>
</script>
<script src="/ckeditor/ckeditor.js?t=C6HH5UF" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var CKEditor_Controls=[],CKEditor_Init=[];function CKEditor_TextBoxEncode(d,e){var f;if(typeof CKEDITOR=='undefined'||typeof CKEDITOR.instances[d]=='undefined'){f=document.getElementById(d);if(f)f.value=f.value.replace(/</g,'<').replace(/>/g,'>');}else{var g=CKEDITOR.instances[d];if(e&&(typeof Page_BlockSubmit=='undefined'||!Page_BlockSubmit)){g.destroy();f=document.getElementById(d);if(f)f.style.visibility='hidden';}else g.updateElement();}};(function(){if(typeof CKEDITOR!='undefined'){var d=document.getElementById('myWidget_myCKEditor');if(d)d.style.visibility='hidden';}var e=function(){var f=CKEditor_Controls,g=CKEditor_Init,h=window.pageLoad,i=function(){for(var j=f.length;j--;){var k=document.getElementById(f[j]);if(k&&k.value&&(k.value.indexOf('<')==-1||k.value.indexOf('>')==-1))k.value=k.value.replace(/</g,'<').replace(/>/g,'>').replace(/&/g,'&');}if(typeof CKEDITOR!='undefined')for(var j=0;j<g.length;j++)g[j].call(this);};window.pageLoad=function(j,k){if(k.get_isPartialLoad())setTimeout(i,0);if(h&&typeof h=='function')h.call(this,j,k);};if(typeof Page_ClientValidate=='function'&&typeof CKEDITOR!='undefined')Page_ClientValidate=CKEDITOR.tools.override(Page_ClientValidate,function(j){return function(){for(var k in CKEDITOR.instances){if(document.getElementById(k))CKEDITOR.instances[k].updateElement();}return j.apply(this,arguments);};});setTimeout(i,0);};if(typeof Sys!='undefined'&&typeof Sys.Application!='undefined')Sys.Application.add_load(e);if(window.addEventListener)window.addEventListener('load',e,false);else if(window.attachEvent)window.attachEvent('onload',e);})();CKEditor_Controls.push('myWidget_myCKEditor');
CKEditor_Init.push(function(){if(typeof CKEDITOR.instances['myWidget_myCKEditor']!='undefined' || !document.getElementById('myWidget_myCKEditor')) return;CKEDITOR.replace('myWidget_myCKEditor',{"htmlEncodeOutput" : true}); });
//]]>
</script>
</form>
....
All the evidence suggests that I am invoking the startup script at the wrong time, but I don't know when the "right time" to invoke it is.
Yoy can use jquery windows.ready function as below
insertScript = "<script type=""text/javascript""> <script language="javascript">
$(document).ready(function() {
window.CKEDITOR.instances.myWidget_myCKEditor.insertText('test');
})
})
</script> ";
Dim cManager As ClientScriptManager = Parent.Page.ClientScript
cManager.RegisterStartupScript(Me.GetType, "insertText", insertScript)
It will make sure your javascript fires only when document get ready and not b4 that.
Kind of a cop-out, but I ended up loading what I needed to insert on the page load and defining the script in the .ascx file.
In my myWidget.ascx:
<script type="text/javascript">
function ddChange(obj) {
window.CKEDITOR.instances.myWidget_myCKEditor.insertText(obj.value);
document.getElementById("myWidget_myCannedPicker").selectedIndex = 0;
}
</script>
...
<asp:DropDownList ID="myCannedPicker" Width="400" runat="server" AutoPostBack="false" OnChange="ddChange(this)" /></span></td>
In myWidget.ascx.vb:
Private Sub fillInitialValues()
...
myCannedPicker.DataSource = dt
myCannedPicker.DataValueField = "msg_text"
myCannedPicker.DataTextField = "msg_name"
myCannedPicker.DataBind()
myCannedPicker.Items.Insert(0, New ListItem("Please make a selection:", "0"))
End Sub
Doesn't really answer to the original question, but it was a suitable workaround in my case.

How to limit the texbox to accept only numbers and backspace?

I have to create a textbox which will ignore all the non numeric input.
I tried to use this code which I found in this site
Private Sub TextBox1_KeyPress(ByVal sender As Object, ByVal e As System.Windows.Forms.KeyPressEventArgs) Handles TextBox1.KeyPress
e.Handled = Not Char.IsDigit(e.Keychar)
End Sub
But I have a mistake in this part of the code System.Windows.Forms.KeyPressEventArgs
What am I doing wrong?
hope this helps
Sub btnDown(ByVal sender As Object, ByVal e As System.Windows.Forms.KeyPressEventArgs) Handles MyBase.KeyPress
if e.KeyChar= Chr(8)
'do something for backspace
else if e.KeyChar=(CHr(13)
'do something for enter
end if
end sub
I agree with Dai
Key stroke in ASP.net SHOULD ALWAYS be managed on the client side to avoid unecessary postback an avoid overloading server .
If you are not familiar with Javascript you can refer to this excelleent tutorial from W3School to manage the onChangeEvent of an input
http://www.w3schools.com/jsref/event_onchange.asp
If you really want to manage the key 'on fly', you can manage the 'onkeyDown' event
http://www.w3schools.com/jsref/event_onkeydown.asp
Use this in code-behind
if(Regex.IsMatch(yourStringToValidate,"^[a-zA-Z0-9\\\$]+$")
{
//Place your msg
}
else
{
//Place your validation msg
}
Try using the MaskedTextBox and set the mask to some thing like this:
maskedTextBox1.Mask = "\d*";
This code should be placed within head section of html.
I have used Jquery library to validate purpose
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#mytext').keydown(function(e) {
if (e.shiftKey) e.preventDefault();
else {
var nKeyCode = e.keyCode;
//Ignore Backspace and Tab keys
if (nKeyCode == 8 || nKeyCode == 9) return;
if (nKeyCode < 95) {
if (nKeyCode < 48 || nKeyCode > 57) e.preventDefault();
} else {
if (nKeyCode < 96 || nKeyCode > 105) e.preventDefault();
}
}
});
});
</script>
Html code
<input type="text" id="mytext">

Programmatically set JWPlayer to play file from database

I have a querystring on page load that I use to get the filename and thumbnail image for JWPlayer. It is not getting the filename or thumbname, however. There must be a reason why I can't get it over to my aspx page, from the VB code behind.See code:
Code Behind (VB):
Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
Dim videoName As String = Request.QueryString("FileName")
Dim thumb As String = Request.QueryString("Thumb")
End Sub
And now I need to get these string variables into the .ASPX page to the JWplayer script, but they do not
.ASPX:
<div id='container'></div>
<script type="text/javascript" src="~/player/jwplayer.js</script>
<script type="text/javascript">
jwplayer("container").setup({
file: videoName,
flashplayer: '~/player/player.swf',
volume: 35,
width: 480,
height: 270,
skin: '~/player/skins/skin.zip',
image: thumb,
})
</script>
This is ho I solved it
Code Behind (VB):
Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
Dim videoName As String = Request.QueryString("FileName")
Dim thumb As String = Request.QueryString("Thumb")
Dim dur As String = Request.QueryString("Duration").ToString()
txt1.Text = "~contents/published/" & videoName.ToString()
txt2.Text = "~/contents/thumbs/" & thumb.ToString()
txt3.Text = dur.ToString()
End Sub
Now to get the value of the query string to the JWPlayer javascript, I had to add a javascript function inside the JW script and I called it codeAddress(). This kind of documentation is NOT found on the LongTail website or tutorials or anywhere else on the internet that I have found.
.ASPX:
<script type="text/javascript">
function codeAddress() {
var dootoo = document.getElementById('<%=txt1.ClientID%>').value;
var doothree = document.getElementById('<%=txt2.ClientID%>').value;
var doofour = document.getElementById('<%=txt3.ClientID%>').value;
jwplayer("container").setup({
duration: doofour,
file: dootoo,
flashplayer: '~/player/player.swf',
skin: "~/player/skins/newtubedark.zip",
volume: 35,
width: 685,
height: 385,
image: doothree,
})
}
window.onload = codeAddress;
</script>
<asp:textbox id="txt1" runat="server" style="display:none;"></asp:textbox>
<asp:textbox id="txt2" runat="server" style="display:none;"></asp:textbox>
<asp:textbox id="txt3" runat="server" style="display:none;"></asp:textbox>

Resources