Calling browse file window of fileupload control - asp.net

I have an ImageButton and a FileUpload controls in a child page of a master page. I would like to achieve something like when user click on the ImageButton, the browse file window will pop-up like what we did when we click on the Browse button of the FileUpload control.
How can call the browse file window of the FileUpload control when i click on the ImageButton?

have you tried this?
<script>
function browse() {
document.getElementById('<%= FileUpload1.ClientID %>').click();
}
</script>
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:ImageButton ID="ImageButton1" runat="server" OnClientClick="browse()"
ImageUrl="http://stackoverflow.com/favicon.ico" />

Related

Problem with losing upload path on refresh in ASP.NET Web Forms

I have a problem with losing my files on FileUpload in ASP.NET Web Forms. I am making a website which contains a form where a pdf page and an image should be uploaded by user, and previewed, but when they choose a headline text, font name and font size below uploads, those controls refresh my page and all of the uploaded files are lost. I have tried to add enctype="multipledata" in the form, but it did not work. Does anyone have a clue? Thanks in advance.
<script type="text/javascript">
function ShowImageBackPreview(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#<%=imagePreview.ClientID%>').prop('src', e.target.result)
.width(240)
.height(150);
};
reader.readAsDataURL(input.files[0]);
}
}
</script>
<asp:FileUpload ID="uploadImage" runat="server" CssClass="uploads" onchange="ShowImageBackPreview(this)" />
<asp:Image ID="imagePreview" Height="150px" Width="250px" runat="server" />
<asp:TextBox ID="txtName" runat="server" AutoPostBack="true" placeholder="Name"></asp:TextBox>
<asp:TextBox ID="txtSurname" runat="server" AutoPostBack="true" placeholder="Surname"></asp:TextBox>
When I start to enter the name and the surname, the uploaded shown image is disappeared and also the file path, on each entered text it refreshes the page.
Remove the autopostback for the controls txtName and txtSurName.
A auto post back means the page will post back when you change the values in those controls, and when you post-back, then the file is up-loaded, and your image preview will be lost.
You need a final up-load button on your page that when clicked on will run your code. That upload button can then grab the file up-loaded. You can't have autopostbacks for the text box controls as you show, but then again, there should NOT be ANY requirement for those text box controls to have autopostback=true.
So, remove your autopostback for the controls, and you should be fine.

cannot access js code in content page

I took one masterpage and one web form selected with the first master page.
In this webform i took textbox and button. Button's OnClientClick property set with validate()
I took one JScript.js file in that i write the following function :
function validate() {
var no = document.getElementById('<%=TextBox1.ClientID %>').value;
if (isNaN(no)) {
alert('not a number.');
}
}
In default.aspx page i write the textbox and button code is as following
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" onclientclick="validate()" Text="Button" />
In master page's head section i call the js file as following :
<script src="JScript.js" type="text/javascript">
</script>
So the my question is this is not worked the alert message not appears as i write non numeric number in textbox.
You can't use asp .net binding syntax in js files.
this will be rendered the same in your js file, and will not contain ur TextBox1ClientId:
var no = document.getElementById('<%=TextBox1.ClientID %>').value;
either pass the client Id from your aspx page as a parameter to the validate method, or embed your javascript function in ur aspx.
You can add clientIDMode="Static" in your control.
<asp:TextBox ID="TextBox1" runat="server" clientIDMode="Static"></asp:TextBox>
<asp:Button ID="Button1" runat="server" clientIDMode="Static" onclick="Button1_Click" onclientclick="validate()" Text="Button" />
Or if you want to make it project level, just add the line in web config file
<pages clientIDMode="Static"></pages>
inside <system.web>.

code behind with postback url

I try to make postpackurl in code behind so that I can send the code but my issue is when I click the button its keep it in the same page .
my question is how I can make the postbackurl directly go to next page?
Asp.net Button Has property named postbackurl which you can set postbackurl:
<asp:button id="Button2"
text="Post value to another page"
postbackurl="Button.PostBackUrlPage2cs.aspx"
runat="Server">
</asp:button>
Use
response.redirect("frmdefault.aspx")
in your button click code.
In the ASPX file add the below Script:-
<script type="text/javascript">
function SomeMethod() {
window.location.reload("nextpage.aspx");
return false;
}
</script>
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="return SomeMethod();"/>
When the user clicks on the button1 the nextpage.aspx page will be executed and no postback will happen on the current page

Jquery Model Window + DataGridview TemplateField

I have a gridview on my Page. I want to open a jquery dialog on the click of the linkButton placed inside the itemtemplate of the gridview. I`ve added the js and css files on my master.aspx page. But still it doesnt open.
My Jquery CODE:
$('#gvLCStatus ContentPlaceHolder1_gvLCStatus_lnkbtnShipment_0').dialog({
create: function (event, ui) { }
('ContentPlaceHolder1_gvLCStatus_lnkbtnShipment_0').bind("dialogcreate", function (event, ui) {
});
});
MY Gridview ItemTemplate Field:
<asp:TemplateField>
<ItemTemplate>
<asp:LinkButton ID="lnkbtnShipment" runat="server">Shipment Status</asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
I want to Open a Jquery Dialog on the click of this item template field.
Use OnClientClick like this.
<asp:LinkButton ID="lnkbtnShipment" runat="server" OnClientClick="return YourFunction(Parameter)')>Shipment Status</asp:LinkButton>

how to set a default 'enter' on a certain button

There is a textbox on a ContentPage. When the user presses Enter in that textbox I am trying to fire a 'Submit' button on this ContentPage. I'd like to fire off that particular button's event.
Instead, there is a search textbox & button on the top of the page from a MasterPage, and this search button's event fires off.
How do I control to fire off this ContentPage's submit button, instead of the MasterPage's search button?
I am using Ektron CMS for my content management.
The easiest way is to put the fields and button inside of a Panel and set the default button to the button you want to be activated on enter.
<asp:Panel ID="p" runat="server" DefaultButton="myButton">
<%-- Text boxes here --%>
<asp:Button ID="myButton" runat="server" />
</asp:Panel>
if you need to do it from code, use
Me.Form.DefaultButton = Me.btn.UniqueID
Where btn is your button control.
You can use the DefaultButton property on either a server-side form control or Panel control. In your case, group the controls together in a Panel that should fire off the same button:
<asp:Panel ID="SearchBox" runat="server" DefaultButton="BtnSearch">
...
<asp:Button ID="BtnSearch" runat="server" Text="Search!" />
</asp:Panel>
....
<asp:Panel ID="UserPanel" runat="server" DefaultButton="BtnUserSubmit">
...
<asp:Button ID="BtnUserSubmit" runat="server" Text="Submit" />
</asp:Panel>
You can now use UseSubmitBehavior property to disable all the buttons you don't want to fire when hitting submit (check out the documentation for more info)
<asp:Button ID="BtnNotToFIre" runat="server" Text="Search" UseSubmitBehavior="false" />
Microsoft say:
<form id="Form1"
defaultbutton="SubmitButton"
defaultfocus="TextBox1"
runat="server">
enter link description here
$(document).ready(function(){
document.getElementById("text_box_id")
.addEventListener("keyup", function(event) {
event.preventDefault();
if (event.keyCode === 13) {
document.getElementById("button_id").click();
}
});
});

Resources