I'm working in tiny project that deal with multiple file uploading.
at the begining user have one fileupload control and a small image called fileuploadadder .
each time user click on fileuploadadder , a clone of the first fileupload control added to the page with jquery . the ids of the fileupload controls are uniqe. such as file1 , file2, ...
now , i want when user clicks on a button at the end of the page asp.net uploads the selected files.
tnx
Here's an example:
<%# Page Language="C#" %>
<%# Import Namespace="System.IO" %>
<script type="text/c#" runat="server">
protected void BtnUpload_Click(object sender, EventArgs e)
{
if (Request.Files != null)
{
foreach (string file in Request.Files)
{
var uploadedFile = Request.Files[file];
if (uploadedFile.ContentLength > 0)
{
var appData = Server.MapPath("~/app_data");
var fileName = Path.GetFileName(uploadedFile.FileName);
uploadedFile.SaveAs(Path.Combine(appData, fileName));
}
}
}
}
</script>
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<form id="Form1" runat="server" enctype="multipart/form-data">
Add file
<div id="files"></div>
<asp:LinkButton ID="BtnUpload" runat="server" Text="Upload" OnClick="BtnUpload_Click" />
</form>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$('#add').click(function () {
$('#files').append($('<input/>', {
type: 'file',
name: 'file' + new Date().getTime()
}));
return false;
});
</script>
</body>
</html>
Related
I am trying to use Visual Studio C# to printscreen, then save the screen capture to a file.
Currently, I am having problems reading from the clipboard.
I have tried using both of the following lines to save a screen capture to the clipboard:
SendKeys.SendWait("+{PRTSC}");
SendKeys.SendWait("{PRTSC}");
However, when I try to save the image using the following lines, I get a Null Reference Exception.
How to do resolve this?
My code below
markup code
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<h2>Welcome to ASP.NET!
</h2>
1. Copy image data into clipboard or press Print Screen
<br />
2. Press Ctrl+V (page/iframe must be focused):
<br />
<br />
<canvas style="border: 1px solid grey;" id="cc" width="200" height="200">
<script type="text/javascript">
var canvas = document.getElementById("cc");
var ctx = canvas.getContext("2d");
//=== Clipboard ===============================
window.addEventListener("paste", pasteHandler); //chrome
//handler
function pasteHandler(e) {
if (e.clipboardData == false) return false; //empty
var items = e.clipboardData.items;
if (items == undefined) return false;
for (var i = 0; i < items.length; i++) {
if (items[i].type.indexOf("image") == -1) continue; //not image
var blob = items[i].getAsFile();
var URLObj = window.URL || window.webkitURL;
var source = URLObj.createObjectURL(blob);
paste_createImage(source);
}
}
//draw pasted object
function paste_createImage(source) {
var pastedImage = new Image();
pastedImage.onload = function () {
ctx.drawImage(pastedImage, 0, 0);
}
pastedImage.src = source;
}
</script>
</canvas>
<br />
</div>
<div>
<asp:Button ID="btn" runat="server" OnClick="btn_Click" Text="Go" />
</div>
</form>
</body>
</html>
code-behind
protected void btn_Click(object sender, EventArgs e)
{
var path = new[] { #"C:\Users\A\source\repos\CopyPaste\public",
#"C:\Users\A\source\repos\CopyPaste\public" }.First(p => Directory.Exists(p));
var prefix = "css-social-media-icon-list";
var fileName = Enumerable.Range(1, 100)
.Select(n => Path.Combine(path, $"{prefix}-{n}.png"))
.First(p => !File.Exists(p));
Clipboard.GetImage().Save(fileName, ImageFormat.Png);
Clipboard.SetText($"})");
}
I hope this helping... following this example
I have this WebForm Html:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="GetLink.aspx.cs" Inherits="GetLink" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="hidden" runat="server" id="hdnVal" value="55"/>
</div>
</form>
</body>
</html>
And i want to add to this code a JavaScript function and run it with this code:
protected void Page_Load(object sender, EventArgs e)
{
if (!ClientScript.IsStartupScriptRegistered("key1"))
{
ClientScript.RegisterStartupScript(GetType(), "key1", #"<script type=""text/javascript"">function callMyJSFunction() { document.getElementById(""hdnVal"").value='5'; }</script>");
}
ClientScript.RegisterStartupScript(this.GetType(), "key1", "<script>callMyJSFunction();</script>");
string resutOfExecuteJavaScript = hdnVal.Value;
}
When i run it the value of hdnVal keep the 55 value and not change. Any idea what is the problem?
Your code in Page_Load event should call ClientScript.RegisterClientScriptBlock when registering the JavaScript function of callMyJSFunction, whereas in your code you are registering this function as a startup script. This is the only mistake in your code.
So, if you change your server-side code to as below, then it will work according to your expectations.
protected void Page_Load(object sender, EventArgs e)
{
if (!ClientScript.IsClientScriptBlockRegistered("key1"))
{
//register your javascript function
ClientScript.RegisterClientScriptBlock(GetType(), "key1", #"<script type=""text/javascript"">function callMyJSFunction() { document.getElementById(""hdnVal"").value='5'; }</script>");
}
ClientScript.RegisterStartupScript(this.GetType(), "key1", "<script>callMyJSFunction();</script>");
string resutOfExecuteJavaScript = hdnVal.Value;
}
The first problem is you are creating function in Clientscript while you can simply put the function in javascript and then just do the calling part.Second problem is that the time your function is calling that hiddenfield for view its not available on document simply means stop putting your code on page load and use a button click event instead.Third problem is you are using multiple inverted commas at so many places which aren't required.
This worked for me
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$('document').ready()
{
function callMyJSFunction()
{
debugger;
document.getElementById('hdnVal').value = '5';
alert(document.getElementById('hdnVal').value);
}
// - including fonts, images, etc.
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="hidden" runat="server" id="hdnVal" value="55"/>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
</div>
</form>
</body>
</html>
and on cs page
protected void Button1_Click(object sender, EventArgs e)
{
ClientScript.RegisterStartupScript(this.GetType(), "key1", "<script>callMyJSFunction()</script>",false);
string resutOfExecuteJavaScript = hdnVal.Value;
}
So just starting out with asp.net... I want to display my textbox when my checkbox is checked, but this doesn't seem to be working. I also tried with the visible property, but that didn't work either. What am I doing wrong exactly?
Code:
protected void checked_CheckedChanged(object sender, EventArgs e)
{
text.Style["display"] = "block";
}
Layout:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<p>gehuwd/samenwonend<asp:checkbox runat="server" ID="checked" OnCheckedChanged="checked_CheckedChanged"></asp:checkbox>
</p>
<asp:TextBox runat="server" ID="text" style="display:none"></asp:TextBox>
</form>
</body>
</html>
Use the AutoPostBack property for checkbox and set it to true:
<asp:checkbox runat="server" ID="checked" OnCheckedChanged="checked_CheckedChanged" AutoPostBack="true"></asp:checkbox>
You can use add css property of textbox in c# as given below. If your checkbox OnCheckedChanged is not working then you can set property AutoPostBack is true in checkbox.
protected void checked_CheckedChanged(object sender, EventArgs e)
{
text.Attributes.Add("display","block");
}
You can also do this completely client side, using jQuery or javascript.Making a post back to the server everytime you need to change the visual appearance of your HTML can put unnecessary strain on the server and have a negative effect on the user experience by slowing down the overall performance of your site.
<head runat="server">
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var id = "<%: text.ClientID %>";
id = "#" + id;
$(id).hide();
$("#chkShowHide").change(function () {
if (this.checked) {
$(id).show();
}
else{
$(id).hide();
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<input id="chkShowHide" type="checkbox" /> Show\Hide<br />
<asp:TextBox runat="server" ID="text"></asp:TextBox>
</form>
</body>
I want to display the search result in the Fancybox. The code works fine in the web form, but when i integrate with the master page, the fancy box is not opening. Please give me a solution!
I created two web forms, Default1.aspx and Default2.aspx
The code in the Default1.aspx is given below,
<head runat="server">
<title></title>
<!-- Add jQuery library -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<!-- Add mousewheel plugin (this is optional) -->
<script type="text/javascript" src="/fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>
<!-- Add fancyBox -->
<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.1.5"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<script lang="javascript" type="text/javascript">
$(document).ready(function (){
$('#fancybox').fancybox({
autoDimensions: false,
height: 400,
width: 700,
type: "iframe"
});
});
</script>
<a id="fancybox" runat="server" style=" visibility: hidden "></a>
<asp:Literal ID="Literal1" runat="server"></asp:Literal>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
</div>
</form>
</body>
**Default1.aspx.cs**
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
TextBox1.Text = Request.QueryString["cargoNo"];
}
}
protected void Button1_Click(object sender, EventArgs e)
{
fancybox.Attributes["href"] = "~/Default2.aspx?cargoNo=" + TextBox1.Text.Trim();
Literal1.Text = "<script> $(document).ready(function() {$(\"#fancybox\").trigger('click');});</script>";
clear();
}
public void clear()
{
TextBox1.Text = "";
}
}
In the Default2.aspx I added a Sql Datasource and used Gridview to display it.
When you enter the number in the text box and click button1. the serach will initiate and display the result in the fancybox. The above code is working great.
When i added this to the Master page the Fancybox is not triggering. Twhen button is clicked, the page just refresh. All replies are appreciated. I am new to asp.net. Please help me to solve this problem.
First of all, make sure You don't call a Jquery source in your Master Page, because I see you are calling Jquery on your Default1.aspx, since Jquery should be load once. Second, if you don't want your button make a Postback, add this to your button: UseSubmitBehavior="False". Hope this help
When a user wants to upload a file (currently there are 4 places in the form that allow for this), they first have to “Choose File” and then they have to click on “Upload”. If they miss the 2nd "Upload" step, there is no indication to them or us.
Is there a way to combine the “two-step” process to a single step (select and upload).
Use this link to know more about it
http://www.c-sharpcorner.com/UploadFile/2b481f/uploading-a-file-in-Asp-Net-web-api/
And you can also use this code
<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
}