Passing image source to aspx code behind - asp.net

I'm trying to use Adobe's new Aviary/Feather SDK with an existing aspx webpage.
Here is the HTML for the Feather integration.
you will notice that i had to add https://test.mywebsite.com before the <% imgEvent.imageUrl %> . Without the website url appended to the beginning the Feather would not work properly.
ASPX page
<div class="span12">
<div id='injection_site'></div>
<asp:Image ID="imgEvent" runat="server" />
<p><input type='image' src='http://images.aviary.com/images/edit-photo.png' value='Edit photo' onclick="return launchEditor('imgEvent', 'https://test.mywebsite.com<%= imgEvent.ImageUrl.ToString()%>');" /></p>
</div>
This will result in the following
HTML page
<div class="span12">
<div id='injection_site'></div>
<img id="imgEvent" src="/image/get/webfile/80a556a0-c251-4fc5-b6e2-9061d8f90f18" />
<p><input type='image' src='http://images.aviary.com/images/edit-photo.png' value='Edit photo' onclick="return launchEditor('imgEvent', 'https://test.mywebsite.com/image/get/webfile/80a556a0-c251-4fc5-b6e2-9061d8f90f18');" /></p>
</div>
The problem seems to be that once Feather is used and the image has been affected with the desired effects, the Html is updated like so
<img id="imgEvent" src="http://featherfiles.aviary.com/2014-10-27/1d6ab55fcc2ecaf5/f304c34d77bc446aa5fb6278dcbea5da.png">
This is because i assume the file is temporarily being stored on their website for the preview. How would i go about downloading this file using the ASPX code behind method?
If i do Me.imgEvent.ImageUrl it will give me the url that was associated to the img on page_load. (Me.imgEvent.imageUrl = "/image/get/webfile/80a556a0-c251-4fc5-b6e2-9061d8f90f18")
Is there a way to pass the new img src parameter to the code behind?

You can make an ajax call to your server with the new url as a parameter. For instance, using the jQuery library, and assuming you have an aspx page with a POST handler, you could do the following:
function onSave(id, url) {
$.post( "saveImage.aspx", { newUrl: url });
}

Related

Submitting form in angularjs in asp.net web page

I am hating asp.net...
I have a really simple web site. In my master page I have a form runat="server".. I need it because in some page I have server side controls (login control for example, or my custom control)..
Now I have a simple page, with a really simple form. And in this page, I would like to use angularjs..
What I want is that (simply) when I submit this angularjs form, I arrive on the server just when the form is valid.
In this page I have tried different solution but no solution works!
The problem I think is that I have a (angularjs) form (in the page, this is not runat="server") that is nested in asp.netform (in the master page, runat="server")..
Here what I tried:
1) remove the asp.net form from the master page and add different asp.net form just where i need, but in some page i had more than one form with `runat="server" and this is not possible:
two form runat=server
2)remove the angularjs form, don't do a submit, but manage a simple ng-click event, but in this way I go on server always, even if form is not valid...
3)leave the angularjs form a do a submit, but in this way I obtain an "invalid postback error"... I have tired this solution but it does not work:
Invalid postback error
What I simply want is to use angularjs and go on server just when form is valid... How can I do? Thank you..
UPDATE:
My MasterPage is:
<body>
<form runat="server">
...
<asp:ContentPlaceHolder ID="content" runat="server"></asp:ContentPlaceHolder>
...
</form>
</body>
My Page is:
<asp:Content ID="Content3" ContentPlaceHolderID="content" runat="server">
<script type="text/javascript" src="/Scripts/angular.min.js"></script>
<script type="text/javascript" src="/Scripts/angular-resource.min.js"></script>
<script type="text/javascript">
(function (angular) {
var public_area = angular.module("public-area", ['ngResource']);
public_area.factory("PresentaUnAmicoService", function ($resource) {
return {
piani_tariffari: $resource("/api/PresentaUnAmico/")
};
});
public_area.controller("PresentaUnAmicoController", function ($scope, PresentaUnAmicoService) {
$scope.sendInvitation = function ()
{
var invitation =
new PresentaUnAmicoService
.piani_tariffari($scope)
.$save();
}
});
})(angular);
</script>
<div data-ng-app="public-area" data-ng-controller="PresentaUnAmicoController">
<form name="presenta_amico-form" novalidate>
<table class="three_column" data-ng-class="{ 'ng-submitted' : submitted }">
... //Here there is my form
<button type="button" class="button link" id="btnSendInvitation" runat="server" data-ng-click="submitted=true" ng-submit="sendInvitation()">
<span><b>INVIA EMAIL</b></span> <img class="middle" src="/Styles/img/continue_24x24.png" />
</button>
...
</table>
</form>
</div>
</asp:Content>
I Know, It's not correct have a form inside another form.. but I am looking for a solution...
What you need in order to nest form is to use
eg:
<form runat="server">
<ng-form name="myFormName" ...>
//Your Code
</ng-form>
</form>
have a look here

<a href or <asp:hyperlink.....tag does not render at runtime

i am trying to display a simple div with hyperlink that represents x
like this:
So, when my run my app i see the div but i dont see the x which is <a href tag
and here is my code:
<div class="success">×status message here...</div>
and when i looked at the source of the page this is what it renders:
<div id="ctl00_ctl00_ContentMain_ContentMain_employee_status" class="success" style="display:block;">status message here...</div>
and then i tried with <asp:hyperlink....
<div class="success" id="divStatus" visible="false" runat="server"><asp:HyperLink id="success" runat="server" CssClass="close" Text="×"></asp:HyperLink></div>
and i still dont see href tag, what is going on here and why i am not able to render the <a href or <asp:hyperlnk tag any clue?
i am writing InnerHtml divSuccess.InnerHtml ="status message here...
if thats the case that erasing its static contents then what is the
alternate?
If divStatus contains controls that you want to keep, then you can append HTML to it by using a Literal control and adding it to the controls collection, like:
var lit = new Literal();
lit.Text = "my text or <strong>html</strong>";
this.divStatus.Controls.Add(lit);
Alternatively, you could use another control inside divStatus and alter its inner HTML:
<div id="divStatus" runat="server">
<a id="lnk1">This is the link that we don't want to be removed.</a>
<asp:Literal runat="server" id="litStatusHtml" />
</div>
here is how i able to solved my question
divStatus.InnerHtml = "<a href='#' class='close'>×</a>" + "status message here...";

Problems using the '#' to identify tags in a master/content/css page combination

I want to separate the design and implementation of my web pages into a separate HTML and CSS files (for easier maintenance).
I have the following Page defined in a project.
<%# Page Title="" Language="C#" MasterPageFile="~/STGGeneral.Master" AutoEventWireup="true" CodeBehind="Register.aspx.cs" Inherits="SystemManager.Register" %>
And this makes a reference to the following CSS file
#UsernameLabel
{
position: absolute;
top: 10px;
left: 10px;
}
The trouble is when ASP.NET generates the code sent to the browser it sends the following
<!-- Login Popup -->
<input type="image" name="ctl00$LoginButton" id="ctl00_LoginButton" class="LoginButton" src="Images/key.png" style="border-width:0px;" />
<div id="ctl00_LoginFormPanel" class="LoginPanel">
<div id="ctl00_UpdatePanel1">
<span id="ctl00_LabelUsername">UserId:</span>
<input name="ctl00$UsernameTextBox" type="text" id="ctl00_UsernameTextBox" />
<span id="ctl00_LabelPassword" class="StandardLabel">Label</span>
<input name="ctl00$PasswordTextBox" type="text" id="ctl00_PasswordTextBox" />
<input type="image" name="ctl00$ConfirmLoginButton" id="ctl00_ConfirmLoginButton" class="ConfirmLoginButton" UseSubmitBehavior="false" src="Images/Security.png" style="border-width:0px;" />
</div>
</div>
Because my 'Username' label is now called ctl00_LabelUsername by ASP.NET the style which positions this code тo longer works.
Is there a way of telling ASP.NET that I do not want it to change the name of my objects, or how do you do a reference using '#' within a page generated by a master/content page combination.
If you are on .NET 4.0, they added ClientIDMode for this purpose
http://weblogs.asp.net/scottgu/archive/2010/03/30/cleaner-html-markup-with-asp-net-4-web-forms-client-ids-vs-2010-and-net-4-0-series.aspx
If you are not using ASP.NET 4.0 you can give a class to the Label, like
LabelUsername.CSSClass = "LabelClass";
else you can try using the CSS selector like-
.LoginPanel span
{
// CSS Propeties for the label.
}
Quite simple. You change your css to reference ctl00_LabelUsername

Can i give print option to print webform data in asp.net

I have a webform on which i display all the details of a particular record now i want to give my client print functionality so he can print those detail. Can this be done in asp.net and if yes then how?
You can use css to specify stylesheets to use for printing. There's not really anything asp.net specific about it - it's handled by the browser.
http://www.alistapart.com/articles/goingtoprint/
Based on what I understood, you want to print part of the page, right?
One option is to use a pop up a new page with content to be printed passed from the current page and let the user print it from the pop up page.
Please refer the following demo:
Print Demo
<script language="javascript" type="text/javascript">
function doPrint()
{
bdhtml=window.document.body.innerHTML;
sprnstr="<!--startprint-->";
eprnstr="<!--endprint-->";
prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17);
prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));
window.document.body.innerHTML=prnhtml;
window.print();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="WithoutPrint">
This area will not print!
</div>
<div id="Print">
<!--startprint-->
This area will print!
<!--endprint-->
</div>
<input id="btnPrint" type="button" value="Print" onclick="doPrint()" />
</form>
</body>
</html>
Hope it helps...Thanks.

Using embedded standard HTML forms with ASP.NET

I have a standard aspx page with which I need to add another standard HTML form into and have it submit to another location (external site), however whenever I press the submit button the page seems to do a post back rather than using the sub-forms action url.
A mock up of what the form relationships is below. Note in the real deployment the form will be part of a content area of a master page layout, so the form needs to submit independantly from the master page form.
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<form id="subscribe_form" method="post" action="https://someothersite.com" name="em_subscribe_form" >
<input type="text" id="field1" name="field1" />
<input id="submitsubform" type="submit" value="Submit" />
</form>
</div>
</form>
</body>
</html>
It's an interesting problem. Ideally you only want the 1 form tag on the page as other users have mentioned. Potentially you could post the data via javascript without having 2 form tags.
Example taken from here, modified for your needs. Not 100% sure if this will work for you but I think this is how you'll have to approach it.
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript">
function postdata()
{
var fieldValue = document.getElementById("field1").value;
postwith("http://someothersite.com",{field1:fieldValue});
}
function postwith (to,p) {
var myForm = document.createElement("form");
myForm.method="post" ;
myForm.action = to ;
for (var k in p) {
var myInput = document.createElement("input") ;
myInput.setAttribute("name", k) ;
myInput.setAttribute("value", p[k]);
myForm.appendChild(myInput) ;
}
document.body.appendChild(myForm) ;
myForm.submit() ;
document.body.removeChild(myForm) ;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div>
<input type="text" id="field1" name="field1" />
<asp:Button ID="btnSubmitSubscribe" runat="server" Text="Submit" OnClientClick="postdata(); return false;" />
</div>
</div>
</form>
</body>
</html>
If javascript is not a viable option - you can use .Net's HttpWebRequest object to create the post call in code behind. Would look something like this in the code behind (assuming your text field is an asp textbox:
private void OnSubscribeClick(object sender, System.EventArgs e)
{
string field1 = Field1.Text;
ASCIIEncoding encoding=new ASCIIEncoding();
string postData="field1="+field1 ;
byte[] data = encoding.GetBytes(postData);
// Prepare web request...
HttpWebRequest myRequest =
(HttpWebRequest)WebRequest.Create("http://someotherwebsite/");
myRequest.Method = "POST";
myRequest.ContentType="application/x-www-form-urlencoded";
myRequest.ContentLength = data.Length;
Stream newStream=myRequest.GetRequestStream();
// Send the data.
newStream.Write(data,0,data.Length);
newStream.Close();
}
If you add an ASP.NET button to the form, and set its PostBackUrl property to the external site, then all the form data will be posted to that URL.
There is a very nice tricky solution for this problem.
You can insert a </form> tag before your <form> to close the asp.net form which causes the problem. Do not forget to add a <form> tag after your html form. It may cause the editor to give you an exception, but do not worry, it will work.
Nested forms are not possible in HTML according to the W3C. You can achieve your intended result using JavaScript or with jQuery as explained by Peter on a blog called My Thoughts.
In my experience, Appetere Web Solutions has the best solution. Simple and elegant...and it's not a hack. Use the PostBackUrl.
I just tried it and everything works as expected. I didn't want to use Javascript because I didn't want to include it in my Master Page for every page that uses it.
I had the same situation as Ross - except that my input types were all of the "hidden" varitey.
Cowgod's answer got me thinking about nested forms within my .aspx page. I ended up "un-nesting" my 2nd form OUT of the main .aspx form ( ) and placed it (along with my js script tags) just under the body tag - but before the main .aspx form tag.
Suddenly, everything was submitting as it was supposed to. Is this a hack?
ASP.NET allows you to have multiple forms on one page, but only one can be runat=server. However I don't think you can nest forms at all.
You might have to make a new master page, one without a form tag on it so the form will work on that one page only. This is not a good solution, unless you can place the form outside the master pages' form, and use javascript to submit the second form, but that's hardly better. There really is no good solution for what you are trying to achieve, and if so I'd like to hear it. I don't think you can do a POST call from a code-behind, can you? I'm sure there's some way. But that's probably the only solution: from code.

Resources