The Html Amp Post goes to the current url?.
<!doctype html>
<html ⚡>
<head>
<meta charset="utf-8">
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-form" rc="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script>
</head>
<body>
<form class="-amp-form" method="post" target="_top" novalidate="" action-xhr="/Home/About">
<input name="name" class="data-input" required="" type="text" placeholder="Name...">
<input name="email" class="data-input" required="" type="email" placeholder="Email...">
<input class="button button-primary" type="submit" value="Subscribe">
</form>
</body>
</html>
Hovering over the submit input button in a browser shows the current url and clicking the button appears to do nothing (using httpFiddler there is no post or get request occuring). The solution is a standard MVC 5 application with the layout changed to include the amp ⚡ symbol in Html declaration and scripts included. Any ideas why it would show the current url when hovering over the button for example https://localhost:44331/Home/Index and not make any posts with the above code when the form button is clicked?
here is one of the resources i have been following from: https://ampbyexample.com/components/amp-form/
The post was working, it just wasn't redirecting to the view after posting. The browser uses the 'action' property on the form to show the url that the user will be sent to and as this value is omitted for an amp action-xhr post it was just showing the current url; however it was still posting to the correct url when clicked. What i was looking to do is a post and redirect and it seems that currently only Get amp requests support page redirection. This might change in the future but for now it needs to use Get requests for page redirecting.
Related
Windows 10 UWP Webview
I have the two html files located in a www folder under Assets (Assets/www/xxx.html) in a Windows 10 UWP, both files in VS 2015 are set to be copied to the output dir.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Simple Script</title>
</head>
<body>
<form action="submit.html" method="post">
Data:<input type="text" name="somedata" > <br> <br>
<input type="submit" value="Submit" >
</form>
</body>
</html>
and submit.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Dummy Submission</title>
</head>
<body>
<h2> Your data has been submitted - Thank You. </h2>
</body>
</html>
The Webview object is embbeded in the XMAL as below
<WebView x:Name="WebBrowser" HorizontalAlignment="Left" VerticalAlignment="Top" Height="532" Width="1014" NavigationStarting="WebBrowser_NavigationStarting"/>
And the index page is loaded by
/// Helper to perform the navigation in webview
/// </summary>
/// <param name="url"></param>
private void NavigateWebview(string url)
{
try
{
Uri targetUri = new Uri(url);
WebBrowser.Navigate(targetUri);
}
catch (FormatException myE)
{
// Bad address
WebBrowser.NavigateToString(String.Format("<h1>Address is invalid, try again. Details --> {0}.</h1>", myE.Message));
}
}
NavigateWebview(#"ms-appx-web:///Assets/www/index.html");
The page loads and displays correctly but it will not display the linked 'submit.html' page, its just blank.
If I trap the Navigation event it does occur but appears to be prefixed by a GUID as show below.
I have changed paths to absolute etc and read the docs in detail but I fail to see why this does not work.
Ideas Please Guys ...
If I trap the Navigation event it does occur but appears to be prefixed by a GUID as show below
The "GUID" is the package name of current app, it is the default value of Authority part of URI schemes. So if you only want to navigate to another page, this absolutely path is right. You can test by code NavigateWebview(#"ms-appx-web://{your package name}/Assets//www/submit.html");
The page loads and displays correctly but it will not display the linked 'submit.html' page, its just blank
For your issue, I change the form method to get, it will work.
<form action="submit.html" method="get" id="myform">
Data:<input type="text" name="somedata"> <br> <br>
<input type="submit" value="Submit">
</form>
Please Click Me to jump
form has two methods for submiting the form data. Get sends form data via a URL string, post sends form data via the server. In my opinion, post method post data firstly and then navigate, and the data are handled at server side. I haven't seen posted form data received and handled on a HTML page, so I guess you did not need use post method. For get method you can receive data and deal them in javascript, here is how to do.
I have an HTML file
<HTML>
<BODY>
<FORM name="form1" method="post">
<INPUT type = FILE name="image" action = http://localhost:61189/api/Utility" REQUIRED/>
<INPUT type = SUBMIT />
</FORM>
</BODY>
</HTML>
When Submitted it triggers the POST function of the APIController.
I want to get the image data to work on. Where in the Request can i get the image data ?
Well i found a way of entering data into HTML request using multi-part form request.
And C# provides good api to deal with such data.
On our website we have a link to another page. This looks like this
<a href="URL" title="Title" class="thisClass">
<img src="IMG" width="20" border="0"/>
</a>
What I want is that when the link is clicked then a popup comes up with ex. this information:
“The page you are trying to enter has xx images and can take long time to load. Are you sure you want to continue”
xx is a variable that can be given from the website where the link is present.
Then there should of course be an OK and CANCEL button on the popup. If the OK button is clicked then the URL be loaded to the browser, if CANCEL is clicked then nothing should happen (return to original page)
The website is programmed in asp.net c#.
We are not interested in a new webpage, but just a simple javascript popup given the user a warning that due to xx number of images the webpage will be slow to load.
This webpage is used on an intranet site and we like to warn users when they enter a website that we expect will take long time to load.
Take a look at the jQuery UI Dialog (http://jqueryui.com/dialog/) or Twitter's Bootstrap Modal (http://twitter.github.io/bootstrap/javascript.html#modals)
I think the both solutions can do what you need.
<a href="URL" title="Title" onclick="return confirm('The page you are trying to enter has xx images and can take long time to load. Are you sure you want to continue?');" class="thisClass">
<img src="IMG" width="20" border="0"/>
</a>
If you can do with the regular browsers' alert box, try this. Else you will have to resort to other jquery plugins to make it look more elegant that are mentioned on other answers.
You can user JqueryUi for this, this library includes Dialog which corresponds to your need.
This is the website :
http://jqueryui.com/dialog/#default
And a sample of code that I find in this url :
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Dialog - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<script>
$(function() {
$( "#dialog" ).dialog();
});
</script>
</head>
<body>
<div id="dialog" title="Basic dialog">
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>
</body>
</html>
There is also example to manage confirmation (button OK and button CANCEL)
I hope that I help you ;)
When I load an aspx page to a popwindow using jQuery model using below code.
function OpenExceptions() {
$('#Equipmentdialog').load('Popups/Test1.aspx', function () {
$(this).dialog({
modal: true,
width: 900,
height: 400
});
});
}
I am unable to call any server side method(C# button click) in the Test1.Aspx method, When I call the the server side events, I am getting resource not found exception?
Can someone please explain me what is the reason?
Thanks
Update: this is the error I am getting
I looked at your sample project and the issue you are experiencing is very simple to explain but I am afraid it's not going to be so simple to make it work.
First I'll explain what's causing the exception.
When the dialog loads, it sets its content to whatever output is generated by the Test.aspx page. Since the page generates this HTML when you navigate to it:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
</title></head>
<body>
<form name="form1" method="post" action="Test.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTI2NTY4ODI3MWRkmRTYlsUe3rVbAI2jDoNeA5EPuo8=" />
</div>
<div>
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAgKd2MeEBAKM54rGBl+Fr2fdw6uP6072WYTIw/gz9N5E" />
</div>
<div>
<span id="Label1">Label</span>
<br />
<br />
<input type="submit" name="Button1" value="Button" id="Button1" />
</div>
</form>
</body>
</html>
The dialog ends up displaying a form whose action is set to Test.aspx; therefore, when you click on the Button on the dialog, it attempts to post back the form to Test.aspx but it doesn't find it because this page is inside Popups/Test.aspx. Now, in order to "fix it" (I say this in quotes because it's not really going to fix anything), you could change the dialog's HTML by brute force; doing something like this:
function OpenExceptions() {
$('#Equipmentdialog').load('Popups/Test.aspx #form1', function (response, status, xhr) {
response = response.replace('action="Test.aspx"', 'action="Popups/Test.aspx"'); //Make sure the form's action is accurate
$(this).html(response);
$(this).dialog({
modal: true,
width: 900,
height: 400
});
});
}
And now, when you click the Button you will no longer receive a Resource Not Found Exception; however, because this causes a normal post back the dialog will disappear, the button will post back the page and the label you have on the page will display the current date and time.
Again, this all happens because you are doing normal post backs as opposed to Ajax requests. My approach above would work if the Button in the Test.aspx page performs an Ajax request but not the kind you get when you use Update Panels and Script Managers. You won't be able to use those tools because of the way they work internally...
If you are looking to use Ajax in your app, I recommend you look at WCF Web Services in conjunction with JQuery. There are many good tutorials online on the topic.
I hope my answer at least helps you understand why this isn't working for you and why it won't work if you continue to use this approach. There are many hacks that you could apply to make it work, but I can't think of a single one that's going to be easy to maintain and scale going forward. The best approach is to do Ajax properly, using WCF web services (or Page Methods) and JQuery.
I'm currently trying to implement something called 3d secure into our checkout system-
Implementing DataCash 3DSecure in C#
I've got most of the way there with it, however now, i'm having trouble creating an iFrame with the correct content in.
Basically, the user enters their credit card details, presses the "order" button and the page contacts the payment gateway (DataCash in our case)
If the card requires 3d secure authentication, a pareq (long message) is returned with a bunch of other stuff.
I've generated the page required, using this code:
HttpWebRequest / HttpWebResponse Base 64 problem
However, i need to implement this into an iFrame.
Here's how the documentation suggest doing it, but i cant seem to get it....
<html>
<head>
<title>Please Authenticate</title>
</head>
<body onload="OnLoadEvent();">
<form name="downloadForm" action="https://mybank.com/vbyv/verify" method="POST">
<input type="hidden" name="PaReq" value="AAABBBBCCCCHHHHHH=">
<input type="hidden" name="TermUrl" value="https:// www. MyWidgits.Com/next.cgi">
<input type="hidden" name="MD" value="200304012012a">
</form>
<script language="Javascript"> <!-- function OnLoadEvent() { document.downloadForm.target = "ACSframe"; document.downloadForm.submit(); } //--> </script>
<!-- MERCHANT TO FILL IN THEIR OWN BRANDING HERE -->
<iframe src="blank.htm" name="ACSframe" width="390" height="450" frameborder="0">
</iframe>
<!-- MERCHANT TO FILL IN THEIR OWN BRANDING HERE -->
</body>
</html>
I actually solved this as follows:
http://www.alexjamesbrown.com/blog/development/implementing-datacash-3d-secure-with-asp-net/