edit_の変更in_placeプラグイン、「(編集をクリック)」をコンテンツに入れます
4102 ワード
edit_in_placeは確かにいい効果です.しかし、主流ユーザーにとって、入力ボックスはそれよりも優れている.どうしてですか.EIPがそこにあるので、修正をクリックできるかどうか分からない人が多いです.いいですよ.後ろにヒントを追加して、いいと言って、それからユーザーが華麗に後ろのヒントをクリックして、変更できないことを発見しました......
自分のこのプラグインにこの機能があるかどうか分かりません.見つからなかった.知っていることを教えてください
では、ヒントを内容に入れましょう.
私が使っているコードはHARDを比較して、後で更新して、先に使うことができます.
jrails_を開くin_place_macros_helper.rbはpluginsにあります.これはhelperのものです.
見たin_place_editor_フィールドメソッド.つまり、普段ページで使用している方法です.
内
モデルpair、フィールドnameを使用しているとします.ページでは次のようになります.
そのうちspanにはtag.to_content_tagが手に入れた.JAvascriptは後ろのin_ですplace_editorが手に入れました.ヒントをコンテンツに追加するには、次のようにします.
たぶんこのような効果です.
つまりtagを変更する必要があるはずだ.to_content_tag部分.この方法はいったい何のために使われているのか.APIを見てみましょう
ああ.分かりました.ここでvalue(object)は出力pairである.nameの値.じゃあ変えなきゃcontent_tag.しかし、他に何が使われているのか分かりません.では、tagのこの方法だけを変えましょう.それで.私たちはin_place_editor_Fieldでは、次のように変更されます.
OK、再起動すると、元の「伝説かもしれない」が「伝説かもしれない(編集をクリック)」となり、このヒントを押すと編集効果が現れます.
---
でも問題が出てきた!
このヒントをクリックすると、入力ボックスの中の内容も多くなります.
原因を尋ねる.これはrailsのことではありません.jsのことです.
public/jquery_を開くinplac.pack.js、pluginsの中のjsを変える必要はありません(以前ブログでeipの中国語のヒントを修正しました)
このファイルは圧縮された.詳しくはお話ししません.対応するページの出力を見つけます.
中のjQuery(this).text().trim().escape_html()は、元のページから取得したコンテンツです.つまり、このコードは、私たちが本来望んでいた「伝説かもしれない」ではなく、「伝説かもしれない」(編集をクリック)というものを手に入れたのです.
いいですよ.HARDコードである以上.では、直接交換します.
では、ページを見ていると、内容をクリックすると、編集ボックスに表示されなくなります.対応するtextareaも同様の改髪です.
事が終わったと思っているかもしれません.そしてselect(EIP)のあるページを開きます.編集をクリックすると、元の値が得られないことがわかりました.例えば、私たちはもともと「気持ち」をEIPのSELECTで選び、編集をクリックすると、SELECTは私が選んだ気持ちを指すべきだったが、今はデフォルトの「選択」を与えている.
もちろん、public/jquery_を変更します.inplac.pack.js.圧縮後に多くの変数が置き換えられるため,selectのコードは複雑である.しかし、私たちはその中に「
参照
var K=N==H?'selected="selected"': #etc
明らかすぎる.N Hがそれぞれ何なのか探してみましょう.コードが見つかりました:H=jQuery(this).html()はEIPを得る前の内容です.
これで簡単です.Hを修正?nono、この変更はめちゃくちゃになった.私たちはSELECTの中のものだけを修正して、次のように変更します.
よし、HARDだけど使えたらOK.
今度は時間があれば変えてもいいです.
自分のこのプラグインにこの機能があるかどうか分かりません.見つからなかった.知っていることを教えてください
では、ヒントを内容に入れましょう.
私が使っているコードはHARDを比較して、後で更新して、先に使うことができます.
jrails_を開くin_place_macros_helper.rbはpluginsにあります.これはhelperのものです.
見たin_place_editor_フィールドメソッド.つまり、普段ページで使用している方法です.
内
tag.to_content_tag(tag_options.delete(:tag), tag_options) + in_place_editor(tag_options[:id], in_place_editor_options)
モデルpair、フィールドnameを使用しているとします.ページでは次のようになります.
<span class="in_place_editor_field" id="pair_name_1_in_place_editor"> </span><script type="text/javascript">
//<![CDATA[
$('#pair_name_1_in_place_editor').editInPlace({update_value:'value', url:'/admin/lovetrees/set_pair_name/1'})
//]]>
</script>
そのうちspanにはtag.to_content_tagが手に入れた.JAvascriptは後ろのin_ですplace_editorが手に入れました.ヒントをコンテンツに追加するには、次のようにします.
<span class="in_place_editor_field" id="pair_name_1_in_place_editor"> ( )</span>
たぶんこのような効果です.
つまりtagを変更する必要があるはずだ.to_content_tag部分.この方法はいったい何のために使われているのか.APIを見てみましょう
# File actionpack/lib/action_view/helpers/form_helper.rb, line 624
def to_content_tag(tag_name, options = {})
content_tag(tag_name, value(object), options)
end
ああ.分かりました.ここでvalue(object)は出力pairである.nameの値.じゃあ変えなきゃcontent_tag.しかし、他に何が使われているのか分かりません.では、tagのこの方法だけを変えましょう.それで.私たちはin_place_editor_Fieldでは、次のように変更されます.
def in_place_editor_field(object, method, tag_options = {}, in_place_editor_options = {})
tag = ::ActionView::Helpers::InstanceTag.new(object, method, self)
#
def tag.to_content_tag(tag_name, str="", options = {})
content_tag(tag_name, value(object) + str, options)
end
#
#etc..
tag.to_content_tag(tag_options.delete(:tag), content_tag(:span, "( )", :class => "notice"), tag_options) + in_place_editor(tag_options[;id], in_place_editor_options)
end
OK、再起動すると、元の「伝説かもしれない」が「伝説かもしれない(編集をクリック)」となり、このヒントを押すと編集効果が現れます.
---
でも問題が出てきた!
このヒントをクリックすると、入力ボックスの中の内容も多くなります.
原因を尋ねる.これはrailsのことではありません.jsのことです.
public/jquery_を開くinplac.pack.js、pluginsの中のjsを変える必要はありません(以前ブログでeipの中国語のヒントを修正しました)
このファイルは圧縮された.詳しくはお話ししません.対応するページの出力を見つけます.
'<input type="text" name="inplace_value" class="inplace.field" value="' + jQuery(this).text().trim().escape_html() + '"/>'
中のjQuery(this).text().trim().escape_html()は、元のページから取得したコンテンツです.つまり、このコードは、私たちが本来望んでいた「伝説かもしれない」ではなく、「伝説かもしれない」(編集をクリック)というものを手に入れたのです.
いいですよ.HARDコードである以上.では、直接交換します.
'<input type="text" name="inplace_value" class="inplace.field" value="' + jQuery(this).text().trim().escape_html().escape_html().replace('( )', '') + '"/>'
では、ページを見ていると、内容をクリックすると、編集ボックスに表示されなくなります.対応するtextareaも同様の改髪です.
事が終わったと思っているかもしれません.そしてselect(EIP)のあるページを開きます.編集をクリックすると、元の値が得られないことがわかりました.例えば、私たちはもともと「気持ち」をEIPのSELECTで選び、編集をクリックすると、SELECTは私が選んだ気持ちを指すべきだったが、今はデフォルトの「選択」を与えている.
もちろん、public/jquery_を変更します.inplac.pack.js.圧縮後に多くの変数が置き換えられるため,selectのコードは複雑である.しかし、私たちはその中に「
参照
var K=N==H?'selected="selected"': #etc
明らかすぎる.N Hがそれぞれ何なのか探してみましょう.コードが見つかりました:H=jQuery(this).html()はEIPを得る前の内容です.
これで簡単です.Hを修正?nono、この変更はめちゃくちゃになった.私たちはSELECTの中のものだけを修正して、次のように変更します.
var K=N==jQuery(this).text().trim().escape_html().replace('( )','')?'selected="selected"': #etc
よし、HARDだけど使えたらOK.
今度は時間があれば変えてもいいです.