I need to show/hide a reusable modal popup that it is in a UserControlWeb (ascx).
In my ASPX web, I defined the UC:
<%# Register TagPrefix="uc" TagName="uc1" Src="~/Controls/modalpopup.ascx" %>
<uc:uc1 ID="ModalPopup1" runat="server" />
I can show/hide the modalpopup with javascript:
$find('MBehavior').show();
$find('MBehavior').hide();
But, I need to do from behind code of my ASPX web.
It is posible?
Try the above
string script = #" <script type=""text/javascript"">
$find('MBehavior').show();
});</script>";
ClientScript.RegisterStartupScript(Page.GetType(), "", script);
Maybe if you have updatepanel in your page you can try;
ScriptManager.RegisterStartupScript(updatePanelID, updatePanelID.GetType(), Guid.NewGuid().ToString(), "$find('MBehavior').show(); $find('MBehavior').hide();", true);
if you want to to run from aspx:
$("#mybutton").click(function(e) {
$find('MBehavior').show();
$find('MBehavior').hide();
e.preventDefault();
});
if from code behind:
$("#mybutton").click(function(e) {
$.ajax( {
type:'Get',
url:'aspxfilename/mymethod',
success:function(data) {
}
});
e.preventDefault();
});
and in .cs file create a method:
[WebMethod]
public static string mymethod()
{
//run javascript
}
Related
I have used page1.aspx & page2.aspx.
In page1.aspx I have used following code,
<div id="resultdiv" >
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
In page2.aspx, i have load the page1.aspx page on the div of page2.aspx page.
the code is,
<script type="text/javascript" >
$(document).ready(function () {
$('#result').load('page1.aspx #resultdiv');
});
<div id="result">
my question is, how to access page1.aspx controls(textbox) from page2.aspx.
pls clarify my doubt. i'm new to jquery.
i dont know what you want to ask but whatever i understand i think you want to get controls of another page....
you can try this below code
function load_controls()
{
$.get("page1.aspx", function( data ) {
$("#result" ).html(data);
});
}
and then call this function where ever you want....hope will help you and if you have any query then just put comment....
You can do something like below in page2.aspx:
<script>
function save() {
$('#resultdiv input').each(function () {
alert($(this).val());
});
}
</script>
Browse and Upload with using asp:FileUploadcontrol is working perfectly fine.
But It is two step process. First we have to browse and then select the file.
I want it working in single step So for making it single step I tried the following code:
protected void Button1_Click(object sender, EventArgs e)
{
//to launch the hidden fileupload dialog
ClientScript.RegisterStartupScript (GetType(),
"hwa", "document.getElementById('fileupload').click();", true);
//Getting the file name
if (this.fileupload.HasFile)
{
string filename = this.fileupload.FileName;
ClientScript.RegisterStartupScript(GetType(), "hwa", "alert('Selected File: '" + filename + ");", true);
}
else
{
ClientScript.RegisterStartupScript(GetType(), "hwa", "alert('No FILE has been selected');", true);
}
}
In this code, there is one fileUpload control that is being invoked on Button1_Click. Ideally it should execute the first line then A file Upload control should be shown and after selecting a file or canceling the dialog, flow should go to next line. But dialog is showing up after full function execution finishes.
Because of this asynchronous or not expected execution flow if (this.fileupload.HasFile) is returning false(because user has not been asked to select any file yet) and I am not getting the selected file name.
Can we modify this code to achieve file upload in single step? Or if any other way is possible to do this?
Note- I have asked not to use window forms and Threads. So solution by using these two is not acceptable.
You are missing the fact there is a client side/server side disconnect in the web environment.
Your line: ClientScript.RegisterStartupScript (GetType(),"hwa","document.getElementById('fileupload').click();", true); is client side code and will not be executed until the serverside script is comleted and the resulting HTML/javascript/CSS returned to the browser as it is client side javascript. YOu want to be leveraging the onchange event of the file upload control.
The question should help you out: ASP.NET FileUpload: how to automatically post back once a file is selected?
this is not exactly what you are looking for but it does what you want. difference is that instead of clicking a separate button you have to click the Browse button. and when you press the Open button, the page will postback. I have used JQuery for this. here's my code
ASPX
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.9.1.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="fileupload1" runat="server" />
<asp:Button ID="btn" runat="server" OnClick="btn_Click" Text="upload" style="display:none" />
</div>
<script type="text/javascript">
var isfirst = true;
$(function () {
$('#<%= fileupload1.ClientID %>').on('change', function (e) {
console.log('change triggered');
$('#<%= btn.ClientID%>').trigger('click'); // trigger the btn button click which i have hidden using style='display:none'
});
});
</script>
</form>
</body>
Code behind
protected void btn_Click(object sender, EventArgs e)
{
//TODO
}
For the ones who land here late,
<div>
<asp:FileUpload ID="fu" runat="server" CssClass="bbbb" onchange="clickSeverControl()"/>
<asp:LinkButton Text="Upload" ID="lnkUpload" runat="server" OnClientClick="showUpload();return false;" OnClick="lnkUpload_Click"/>
</div>
hide the file control with css
<style>
.hiddenStyle {
visibility:hidden;
}
</style>
on client click event of link button trigger the click of file upload control
function showUpload() {
document.getElementById("fu").click();
}
on change event trigger the server side click
function clickSeverControl() {
__doPostBack('<%= lnkUpload.ClientID %>', 'OnClick');
}
on server click save the uploaded file
protected void lnkUpload_Click(object sender, EventArgs e)
{
fu.PostedFile.SaveAs(Server.MapPath("~/Upload") + "/" + fu.PostedFile.FileName);
}
Thanks for the other answer I have just combine two example and got the solution for my problem in my project
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.9.1.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="fileupload1" runat="server" />
<asp:Button ID="btnUploadBulk" runat="server" OnClick="btn_Click" Text="upload" style="display:none" />
</div>
<script type="text/javascript">
var isfirst = true;
$(function () {
$('#<%= btnUploadBulk.ClientID%>').on('click', function (e) {
showUpload();
})
});
function showUpload() {
var control = document.getElementById("<%= FileUploadControl.ClientID %>");
control.click();
}
</script>
</form>
Code Behind
protected void btn_Click(object sender, EventArgs e)
{
//TODO
}
This worked for me
I really dont understand why this simple example doesnt work :S
I have a WebApplication in which I have a script :
function myAlert() {
$("#Button1").click(function () {
alert("Hello world!");
});
}
In my asp page, I have this simple code
<%# Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Graph.aspx.cs" Inherits="WebApplication.Graph" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<asp:Button ID="Button1" runat="server" Text="Button" Width="100px"/>
</asp:Content>
And finally I register the script in the cs :
protected override void OnPreLoad(EventArgs e)
{
Page.ClientScript.RegisterClientScriptInclude("jQuery",
ResolveUrl(#"Scripts\jquery-1.4.1.js"));
Page.ClientScript.RegisterClientScriptInclude("jMyAlert",
ResolveUrl(#"Scripts\MyAlert.js"));
// check if the start up script is already registered with a key
if(!Master.Page.ClientScript.IsStartupScriptRegistered("jMyAlert"))
{
// since it is not registered, register the script
Master.Page.ClientScript.RegisterStartupScript
(this.GetType(), "jMyAlert", "myAlert();", true);
}
}
protected void Page_Load(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(this, this.GetType(), "jMyAlert", "myAlert()", true);
}
I dont see what's wrong with this. I tried to include the scrit directly inside the aspx but nothing. I then try onto a simple html page and it works fine.
I want to use a plotting library using jQuery in my page so I'm very far to succeed if such a simple example causes me such a lot of problem...lol
Try checking the debug console within whatever browser you are using to see if "$" is undefined. It sounds like you are missing jquery when using the full ASP.NET approach.
The Id of that button is not going to be #Button1 because of the use of the master page. Try viewing the source to see what I mean.
To solve this, you will need to be able to see the actual Id in the JavaScript.
Something like this in your Page_Load method:
ScriptManager.RegisterClientScriptBlock(this, this.GetType(),
"Button1Id", string.Format("var Button1Id = '{0}';", Button1.ClientID), true);
Will create the following in your page:
<script type="text/javascript">
//<![CDATA[
var Button1Id = 'Button1';//]]>
</script>
Which then means that your myAlert method will need to look like this:
function myAlert() {
$("#" + Button1Id).click(function () {
alert("Hello world!");
});
}
I have webapplication in c# asp.net 4.0
I have User Control in that I have written javascript :-
<script>
function SetValue() {
alert(document.getElementById('offSetClient').value);
}
</script>
<asp:HiddenField ID="clientDateTime" runat="server" />
<asp:HiddenField ID="offSetClient" runat="server" Value="Test"/>
and this User Control added into a web form.
Please suggest me how can I call this javascript on User Control page load.
You can use Page.ClientScript.RegisterStartupScript to attain this.
protected void Page_Load(object sender, EventArgs e)
{
Page.ClientScript.RegisterStartupScript(GetType(), "ShowAlert", "SetValue('" + offSetClient.ClientID + "');", true);
}
Please add an input parameter for the function to get the object of hidden field and pass the same from function.
<script type="text/javascript">
function SetValue(objHdn) {
alert(document.getElementById(objHdn).value);
}
</script>
I have an image button on a pop up page which is opened by another page
<asp:ImageButton
ID="Button_kalem_islemikaydet"
runat="server"
CausesValidation="False"
ImageUrl="~/images/butonlar/buyuk/Kaydet.jpg"
meta:resourcekey="Button_kalem_islemikaydetResource1"
OnClick="Button_ust_islemikaydet_Click"
OnClientClick="f2()"
Width="100" />
f2() is
<script type="text/javascript">
function f2() {
opener.document.getElementById("TextBox1").value = "hello world";
opener.document.getElementById("HiddenField1").value = "hello world";
window.opener.location.href = window.opener.location.href;
}
</script>
And Button_ust_islemikaydet_Click is another method implemented in aspx.cs file and it updates the database tables which are shown in the parent page in a GridView.
What I am trying to do is to doPostBack I mean refresh the opener(parent) page.And with these above codes refresh is working.However, parent page still shows the same data before the refresh.And the reason is that OnClientClick works before OnClick method
So my question is that is there any way I can run the method on OnClick and finish it and then run the OnClientClick method?
<form id="aspnetForm" runat="server">
<asp:Button Text="Click Me" ID="ClickMeButton" OnClick="ClickMeButton_OnClick" runat="server" />
<asp:HiddenField runat="server" ID="UpdateOpenerHiddenField" Value="false" />
<script type="text/javascript">
//1st approach
var updateOpenerField = window.document.getElementById("<%= UpdateOpenerHiddenField.ClientID %>");
if (updateOpenerField.value === "true") {
f2();
updateOpenerField.value = "false";
}
// for the 2nd approach just do nothing
function f2() {
alert("Hello, opener!");
}
</script>
</form>
protected void ClickMeButton_OnClick(object sender, EventArgs e)
{
//1st approach
UpdateOpenerHiddenField.Value = "true";
// 2nd approach
ClientScript.RegisterStartupScript(this.GetType(), "RefreshOpener", "f2();", true);
}
No, you can't run server side code (OnClick event handler) before client side. OnCLientClick event was added to perform some validation before post back. There is only one way to do it - update the f2 method and post data on server via ajax
You can put your javascript inside a PlaceHolder tag which you make visible in your server-side OnClick handler.
aspx code:
<asp:PlaceHolder id="refreshScript" visible="false" runat="server">
window.opener.location.href = window.opener.location.href;
window.close();
</asp:PlaceHolder
cs code:
protected void button_Click(Object sender, EventArgs e) {
// do whatever
refreshScript.Visible = true;
}