Go - How to load a new html form - go

After processing a jQuery Ajax Post from an HTML form successfully within a Go program, how do I load a new form? I first tried sending the form as the response and the Javascript displayed it, but it did not clear the old (existing) form. I then tried within the HTML Javascript to set the URL using "window.location = 'localhost:8088/MaintForm/'". That resulted in a warning from the browser but did not load the form and did not change the URL. I would like to ideally know both methods - via the Go program acting as a server, and via Javascript. If I manually change the URL, the form loads OK. What I am trying to do is receive a response in Javascript (jQuery Ajax), and then request the new form if the response is positive. I would prefer to do this without changing the URL. As I said above, this partially worked.

You would have to put your original form inside a tag, for example a div, and use your JQuery code to replace the contents of that tag with the new form. This way you are not changing the URL.
This is more of a javascript/JQuery question than a go-specific one.

In javascript:
location.href = '/MaintForm/';
In golang, you can use the http.Redirect function, like this:
http.Redirect(w, r, "/MaintForm/", http.StatusFound)

Please note: this appears to be solved by : I just need to do an "document.write(data);" in Javascript. "Data" contains the new HTML.

Related

yii Ajax link not working

I put a Ajax link using the following code:
echo chtml::ajaxLink('GO', 'http://localhost/index.php?r=user/delete', array('method'=>'POST'));
But, regardless of giving the second parameter as URL i,e 'http://localhost/index.php?r=user/delete'. It generates link with the current URL in the browser not the URL I just specified.
What is the issue? How could I create AJAX link? Google several hours but can't solve the issue.
Any kind of help is highly appreciated.
First of all, you should always try and create normalized urls.
But i think your doubt lies in the # that is generated/appended. If you go and check the source of yii ajaxLink you'll see this:
public static function ajaxLink($text,$url,$ajaxOptions=array(),$htmlOptions=array())
{
if(!isset($htmlOptions['href']))
$htmlOptions['href']='#';
$ajaxOptions['url']=$url;
$htmlOptions['ajax']=$ajaxOptions;
self::clientChange('click',$htmlOptions);
return self::tag('a',$htmlOptions,$text);
}
so if you don't set the href property of the a tag in the htmloptions array, the # will be appended.
You should also understand that yii uses jquery, so if you check out the source of the page, you'll see at the bottom, how jquery is used to carry out an ajax request, your actual url that is called will also be seen in that script. So the third option/parameter in ajaxLink is for options for jquery's ajax function. You can create better ajax links using this option.
Regardless of where(which controller) your url points to in your project, the action associated with that url will be called.
So anyway, you can modify your code like this if you want the url to be shown and not a # :
echo CHtml::ajaxLink('GO', 'http://localhost/index.php?r=user/delete',
array('type'=>POST), //there are various other options for jquery ajax
array('href'=>'http://localhost/index.php?r=user/delete'));
To make better ajax links i would suggest going through jquery's ajax documentation. There is an option for a success function, that you can use to let the user know that the operation was completed.
Hope this helps, don't hesitate to leave comments if i haven't answered your question completely.
Have you tried:
echo CHtml::ajaxLink('GO', array('/user/delete'), array('method'=>'POST'));
as the ajaxLink documentation suggests...? Look also at the normalizeUrl method.
Using these methods, which in turn are using createUrl, is usually better since it will take care to create a valid url for your site.
I had the same issue(or maybe similar).
I've used renderPartial to load view and later in that view i was using ajaxLink and it was not working.
What i have found, that when using renderPartial, there was no jquery script for ajax action.
What you have to do is to add 4th argument(true) in renderPartial function to generate jquery script.
See the documentation: http://www.yiiframework.com/doc/api/1.1/CController/#renderPartial-detail
Hope it helps and saves time to figure it out.

RedirectToAction MVC 3 after $.ajax call

From my view I am sending via $.ajax a JSON object to my controller to save it in the database.
If all succeeded i want to redirect to another action which will show a diferent view.
If i use this code:
return RedirectToAction("CreatePage", "Survey", new {id = question.PageId});
The execution goes to the Survey controller which returns a view but it is not shown.
I have read some post which said that it is not posible to redirect via ajax.
The solution I use so far is to redirect via javascript like this:
success: function (ret) {
window.location.href = "/Survey/CreatePage/" + $("#PageId").val();
}
Although this always works, sometimes i need to refresh the CreatePage view to show the last changes made.
Any idea of how to solve this problem better?
Thanks in advance
As mccow002 suggested, I wasn't really needing to make the call via AJAX for that part. After studying the solutions suggested, i realized that i could simple submit it in a form. My confusion came because I have a save and continue editing and a save. For the save and continue I use the AJAX call, but for the save option with the form being submitted is ok.
Thanks very much for your help.
Instead of redirecting to a new page, you can send a rendered html from .net code back to client and load that html in page, like this $("#main").load(renderedHtml).
But for refreshing the page you can write a simple script that run at specified intervals and refresh the page contens.
You could use [OutputCache] on the CreatePage action so that it doesn't cache the page or only caches for so long.
output caching

how to get information from php without refreshing the page

hi
sorry for the bad title but I'm not 100% sure what I need for this problem
I created a welcome page and then when you click on links you get more information, for example:
Click Me
And then the php would get the information based on the id.
so the information received is reloaded on the page after the pages refreshes
what I would like to be able to do is when user clicks on the link, use jquery to not allow the link to run but still run the url in the background (without refreshing the page)
I have no idea where to start from so I really hope you could help
thanks
In a nutshell, it's called Ajax: sending an HTTP request to your server through javaScript, and receiving a response which can contain results, data, or other information.
You mention jQuery, here are the docs about that:
http://api.jquery.com/jQuery.get/
http://api.jquery.com/jQuery.post/
are convenience methods, which encapsulate $.ajax with preset options.
http://api.jquery.com/category/ajax/ is an overview of the whole system in jQuery.
The basics go like
//include jquery, etc.
$(document).ready(function(){
$('#some_element').click(function(){
$.get('some_url_on_your_server.php',{'data':'whatever params'},function(data){
do_something();//
},'json');
});
This will bind an element to make an Ajax call on click, and then you use the function ('success' function, in $.ajax) to handle the json data.
Have your server send back the data in JSON by using json_encode in php. Be sure to send the right header back, like
<?php
header('Content-Type: application/json');
echo json_encode($some_array);
exit;
There's a lot of resources on the web and SO for learning about Ajax, it's a big topic. Best of luck.
Make a JavaScript function, like sendData(linkId) and then each tag would have an onclick event called sendData(this). SendData(linkId) can then do an HTTPRequest (also known as an asynchronous or AJAX request) to a php file, let's call it handler.php, which receives GET or POST methods. I prefer using the prototype framework to do this kind of thing (you can get it at prototypejs.org).
Okay, now that I have said all that, let's look into the nitty-gritty of how to do this (way simplified for illustrative purposes).
Download the prototype script, save it on your server (like prototype/prototype.js, for example) and then put somewhere in your html <script type='text/javascript' language='Javascript' src='prototype/prototype.js'></script>
Your tags would look like this:<a id='exampleLink' onclick = 'sendData(this)'>Click me!</a>
You need JavaScript to do this: function sendData(tagId){
var url = 'handler.php?' + 'id=' + tagId;
var request = new AJAX.Request(url, {method = 'get'});
}
Finally, you need a php file (let's call it handler.php) that has the following: <?php
$tag_to_get = $_GET['tagId'];
do_a_php_function($tag_to_get);
?>
That's it in a nutshell, but it's worth mentioning that you should give your user some sort of feedback that clicking link did something. Otherwise he will click the link furiously waiting for something to happen, when it is actually doing just what its supposed to but in secret. You do that by making your php script echo something at the end, like 'Success!', and then add an onSuccess parameter to your JavaScript's new Ajax.Request. I'll let you read how to do that on your own because the prototype website explains how to receive a response from the handler and put the feedback somewhere in your HTML without making the user refresh.
you can achieve that behavior with a jquery function called $.get ... you can get more information on how to use here http://api.jquery.com/jQuery.get/
If you really want to (and I don't think you really do), you can use XMLHTTPRequest (wrapped in jQuery.get) to facilitate loading content into the page without page refreshing. You want an id or class on that tag, i.e. Click Me, and then:
<script>
$(".fetch").bind("click", function(evt)
{
$.get(this.attr("href"), function(data)
{
$("#whereIWantMyContent").html(data);
});
evt.preventDefault();
});
</script>
I would recommend you use AJAX to start with. A good place to being is http://www.w3schools.com/Ajax/Default.Asp
The link comes with a handy AJAX ASP/PHP Example too =))
Good Luck.

XHR call returns HTML, how to use that and reload the entire page?

A XHR call returns HTML, how do I tell the browser to use that and reload the entire page? I know the main use for XHR is to do partial page fresh but my case is a bit special. Thanks.
Or put it in a more general term, what is the best way to use JS to simulate a browser form GET request? window.location.replace("url")?
rather than trying to reload or something, have you considered doing something like
document.body.innerHTML = [the string HTML that you got back from XHR];
Or perhaps you could do it by building a new DOM from the HTML and then swapping it in?

CKEditor: Strange Characters after ajax submit

I am using ajax to gather the CKEditor content and submit it to the server. Once I look at it after it is submitted, all the html tags < and > have been converted to their html entities. This is not what I want, as I obviously need to preserve the HTML.
Is there something I did wrong?
A couple of questions:
Which AJAX library are you using?
What method are you using to fetch the content from CKEditor?
I use jQuery + validate (form validation plugin) for my form submissions.
The textarea to which CKEditor is bound is named body.
For some weird reason when I submitted the form, the content wasn't being submitted at all. Looking into the HTML I found that the textarea wasn't being populated by CKEditor (don't ask me why).
What I did was to just prior to submission, manually grab the data from CKEditor and stash it into the textarea. A single line of jquery should suffice.
$( '#body' ).val( CKEDITOR.instances.body.getData() );
And then proceed with the form submission normally. jQuery has a very good data serialization method - a function called serialize(), which I use to convert the entire form's data into a string. At the PHP end, this string is auto-converted into members of the $_POST array.
You should try the same approach and see if it works for you.
If you're still stuck, post your code here.
Cheers,
m^e
In the end I realized that my server was not saving the data at UTF-8 even though ajax was sending it this way. So, I fixed that and the data saves correctly.
Correct is to set up in config this
entities : false

Resources