nadine
2008-Jul-02 15:51 UTC
problem with "in place edit" within "sortable list" - messes up html in firefox
hello,
i''ve been trying to solve this problem for ages now, but without any
progress.
i want to do in place edit with a sortable list, and it works fine in
safari and ie, but not in firefox
template:
--------------------------------------------------------------------------------------
<ul id="category-list">
<% @categories.each do |category| %>
<li class="category" id="category_<%= category.id
%>">
<div class="handlecat">
<span><%=h category.title %></span>
</div>
<% @category = category %>
<span id="cat_desc_edit_<%= category.id
%>"><%category.description %></span>
<%= in_place_editor "cat_desc_edit_" + category.id.to_s,
{:url
=> {:action => "update_desc", :id => @category.id},
:clickToEditText
=> "edit ...", :on_failure => "function(transport)
{alert(\"Error: \"
+ transport.responseText.stripTags());}", :script => true } %>
<span><%= link_to ''Show'', category
%></span>
<span><%= link_to ''Edit'',
edit_category_path(category) %></
span>
<span><%= link_to ''Destroy'', category,
:confirm => ''Are you
sure?'', :method => :delete %></span>
<span><%= link_to ''Add new Note'', :controller
=>
"notes", :action => "new", :category_id => category.id
%></span>
<ul class="notes-list" id="notes-list_<%=
category.id %>">
<% category.notes.each do |note| %>
<li id="note_<%= note.id %>">
<div>
<div class="handlenote">
<p><%=h note.title %></p>
</div>
<p><%=h note.description %></p>
<%= link_to ''Show'', note %>
<%= lightwindow_link_to("edit", {:controller =>
''notes'', :action => ''edit'', :id =>
note.id}) %>
<%= link_to ''Edit'', edit_note_path(note)
%>
<%= link_to ''Destroy'', note, :confirm =>
''Are you
sure?'', :method => :delete %>
</div>
</li>
<% end %>
</ul>
</li>
<div style="clear: both;"></div>
<% end %>
</ul>
--------------------------------------------------------------------------------------
the important bit in the template is this line:
<%= in_place_editor "cat_desc_edit_" + category.id.to_s, {:url
=>
{:action => "update_desc", :id => @category.id},
:clickToEditText =>
"edit ...", :on_failure => "function(transport)
{alert(\"Error: \" +
transport.responseText.stripTags());}", :script => true } %>
when i take it out everything is displayed right.
--------------------------------------------------------------------------------------
this is what firefox is displaying and what firebug tells me
(the 4 lines in the beginning are important, as it shows that the <ul>
closes too early):
--------------------------------------------------------------------------------------
<ul id="category-list">
<li id="category_15" class="category"
style="position: relative;">
</li>
</ul>
<span>
<a href="/categories/15">Show</a>
</span>
<span>
<a href="/categories/15/edit">Edit</a>
</span>
<span>
<a onclick="if (confirm(''Are you sure?'')) { var f
document.createElement(''form''); f.style.display =
''none'';
this.parentNode.appendChild(f); f.method = ''POST''; f.action
this.href;var m = document.createElement(''input'');
m.setAttribute(''type'', ''hidden'');
m.setAttribute(''name'', ''_method'');
m.setAttribute(''value'', ''delete'');
f.appendChild(m);var s document.createElement(''input'');
s.setAttribute(''type'', ''hidden'');
s.setAttribute(''name'',
''authenticity_token'');
s.setAttribute(''value'',
''5e20adf4b9ed8984159ad99e9fdc42e03dba6b73'');
f.appendChild(s);f.submit(); };return false;" href="/categories/
15">Destroy</a>
</span>
<span>
<a href="/notes/new?category_id=15">Add new Note</a>
</span>
<ul id="notes-list_15" class="notes-list"
style="position: relative;">
<li id="note_41" style="position: relative; z-index: 0; left:
0px;
top: 0px;">
</li>
<li id="note_33" style="position: relative;">
</li>
</ul>
<div style="clear: both;"/>
<li id="category_24" class="category">
<div class="handlecat">
</div>
<span id="cat_desc_edit_24" class="" title="Click to
edit"
style="background-color: transparent;">kjkhj kkjhbkjhb lkjhkjhmmmb
</
span>
</li>
-------------------------------------------------------------------------------------
so firefox just closes the <ul> </ul> way early than i tell it to
do.
--------------------------------------------------------------------------------------
this is what is (correctly, as i think) being displayed in safari and
ie:
--------------------------------------------------------------------------------------
<ul id="category-list">
<li class="category" id="category_15">
<div class="handlecat">
<span>cat 2</span>
</div>
<!--<span></span>-->
<span id="cat_desc_edit_15"></span>
<script type="text/javascript">
//<![CDATA[
new Ajax.InPlaceEditor(''cat_desc_edit_15'',
''/categories/update_desc/
15'', {evalScripts:true})
//]]>
</script>
<span>9</span>
<span><a
href="/categories/15">Show</a></span>
<span><a
href="/categories/15/edit">Edit</a></span>
<span><a href="/categories/15" onclick="if
(confirm(''Are you
sure?'')) { var f = document.createElement(''form'');
f.style.display ''none''; this.parentNode.appendChild(f);
f.method = ''POST''; f.action this.href;var m =
document.createElement(''input'');
m.setAttribute(''type'', ''hidden'');
m.setAttribute(''name'', ''_method'');
m.setAttribute(''value'', ''delete'');
f.appendChild(m);var s document.createElement(''input'');
s.setAttribute(''type'', ''hidden'');
s.setAttribute(''name'',
''authenticity_token'');
s.setAttribute(''value'',
''5e20adf4b9ed8984159ad99e9fdc42e03dba6b73'');
f.appendChild(s);f.submit(); };return
false;">Destroy</a></span>
<span><a href="/notes/new?category_id=15">Add new
Note</a></
span>
<!-- -->
<ul class="notes-list" id="notes-list_15">
</ul>
</li>
<div style="clear: both;"></div>
<li class="category" id="category_16">
<div class="handlecat">
<span>cat 3</span>
</div>
...............
-------------------------------------------------------------------------------------------------------------------------
please help!!! i really don''t know what to do any more and why this is
happening!!!!
it must be the one in place edit line, because when i don''t use it the
whole site is displayed correctly.
if there are any questions please ask.
thank you!!!!
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---