This is a long one, but it should be easy to parse through.
Thank you for the reply. A couple of things:
1) The problem is with Firefox, that's what I'm using for development.
2) The above code (and the code from the codetunes.com site) give the
error "can't modify frozen array"
I set it as a before filter in my blog_entries controller.
This does bring up a few things. Does this mean that the reason for
my problem is that Rails is not detecting that the browser is sending
and xhr request, and thus assuming that it is html? This is strange
to me because it's literally the same form. I ran a test where I left
the form alone, and didn't try to change to form so that it would PUT/
UPDATE, I left it as POST/CREATE, and Rails returned the js file, not
the html file.
In my javascript returned from the "create" method, I am modifying the
form that that it looks just the same as the form that is generated
when I am editing an entry. It may be something that I'm doing, I
don't know. I'll post the HTML and javascript (according to firebug)
for fun:
HTML of the create form before I submit it for the first time:
/* ---------------------------------- BEGIN */
<form action="/blog_entries" class="new_blog_entry"
id="submit_blog_entry" method="post" onsubmit="$.ajax({data:$.param($
(this).serializeArray()) + '&authenticity_token=' +
encodeURIComponent('3ec895eb98a99ed6f134a6112d93005e50f2834b'),
dataType:'script', type:'post', url:'/blog_entries'}); return false;">
<div style="margin: 0pt; padding: 0pt;">
<input name="authenticity_token"
value="3ec895eb98a99ed6f134a6112d93005e50f2834b" type="hidden">
</div>
<div class="indentUppercase">Title</div>
<input class="inputLarge onehundredpercent" id="blog_entry_title"
name="blog_entry[title]" size="30" type="text">
<br>
<div class="indentUppercase">Post</div>
<textarea cols="40" id="blog_entry_content" name="blog_entry
[content]" rows="20"></textarea>
<table width="100%">
<tbody><tr>
<td>
<table>
<tbody><tr>
<td class="blueControl" id="savePost"><input
class="blueControl" name="commit" value="Save" type="submit"></td>
<td class="blueControl" id="saveAndUnpublish"
style="display: none;">Save & Unpublish</td>
<td class="blueControl" id="publishPost">Publish</td>
</tr>
</tbody></table>
</td>
<td class="right" width="50">
<table>
<tbody><tr>
<!-- this is the button to replace this html and generate a new
partial for a new blog entry -->
<td class="blueControl" id="newPost"><input onclick="$
("form#submit_blog_entry").block_this(); $.ajax
({data:'authenticity_token=' + encodeURIComponent
('3ec895eb98a99ed6f134a6112d93005e50f2834b'), dataType:'script',
type:'post', url:'/dashboard/new_blog_entry'});" value="new"
type="button"></td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>
<br> </form>
/* ---------------------------------- END */
Here is the javascript that is returned that changes the form:
/* ---------------------------------- BEGIN */
$("#status").show();
$("#status").html("Blog entry was successfully created.");
$(".blockMe").unblock();
$("#status").fadeOut(3000);
if($("#submit_blog_entry").find("input[name*='method']").length == 0)
$("#submit_blog_entry").find("input
[name*='authenticity_token']").parent().prepend("<input type=\"hidden
\" name=\"_method\" value=\"put\" />");
else
$("#submit_blog_entry").find("input[name='_method']").val("put");
$("#submit_blog_entry").attr("action", "/blog_entries/50");
var onsub = $("#submit_blog_entry").attr("onsubmit");
$("form#submit_blog_entry").removeAttr("onsubmit");
$("form#submit_blog_entry").removeAttr("onSubmit");
onsub = onsub.replace(/url:'\/blog_entries/g, "url:'/blog_entries/
50");
$("form#submit_blog_entry").submit(function(){ eval(onsub); } );
$("form#submit_blog_entry").attr("onsubmit", onsub);
alert(onsub);
/* ---------------------------------- END */
And here is the html of the form after that return:
/* ---------------------------------- BEGIN */
<form action="/blog_entries/50" class="new_blog_entry"
id="submit_blog_entry" method="post">
<div style="margin: 0pt; padding: 0pt;">
<input name="_method" value="put" type="hidden">
<input name="authenticity_token"
value="3ec895eb98a99ed6f134a6112d93005e50f2834b" type="hidden">
</div>
<div class="indentUppercase">Title</div>
<input class="inputLarge onehundredpercent" id="blog_entry_title"
name="blog_entry[title]" size="30" type="text">
<br>
<div class="indentUppercase">Post</div>
<textarea cols="40" id="blog_entry_content" name="blog_entry
[content]" rows="20"></textarea>
<table width="100%">
<tbody><tr>
<td>
<table>
<tbody><tr>
<td class="blueControl" id="savePost"><input
class="blueControl" name="commit" value="Save" type="submit"></td>
<td class="blueControl" id="saveAndUnpublish"
style="display: none;">Save & Unpublish</td>
<td class="blueControl" id="publishPost">Publish</td>
</tr>
</tbody></table>
</td>
<td class="right" width="50">
<table>
<tbody><tr>
<td class="blueControl" id="newPost"><input onclick="$
("form#submit_blog_entry").block_this(); $.ajax
({data:'authenticity_token=' + encodeURIComponent
('3ec895eb98a99ed6f134a6112d93005e50f2834b'), dataType:'script',
type:'post', url:'/dashboard/new_blog_entry'});" value="new"
type="button"></td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>
<br> </form>
/* ---------------------------------- END */
You may notice that the onsubmit attribute doesn't contain anything,
however, a quick call using:
$("form#submit_blog_entry").attr("onsubmit");
yields:
$.ajax({data:$.param($(this).serializeArray()) +
'&authenticity_token=' + encodeURIComponent
('3ec895eb98a99ed6f134a6112d93005e50f2834b'), dataType:'script',
type:'post', url:'/blog_entries/50'}); return false;
Which is exactly what it's supposed to be (or so it seems), when I
look at the onsubmit for the form generated from the partial for an
edit, it looks like
$.ajax({data:$.param($(this).serializeArray()) +
'&authenticity_token=' + encodeURIComponent
('3ec895eb98a99ed6f134a6112d93005e50f2834b'), dataType:'script',
type:'post', url:'/blog_entries/46'}); return false;
exactly the same, but this one actually returns the js format, not the
html
Anyone have any ideas? Thanks again for the help thus far.
Groove
