स्टाइल प्लेसहोल्डर मूल्य से अलग से best_in_place

Question

मुझे लगता है कि मुझे कुछ याद आ रहा है क्योंकि सीएसएस के माध्यम से किसी भी_इन_स्थल मूल्य और प्लेसहोल्डर (डेटा-शून्य = "अपना नंबर दर्ज करें") के बीच अंतर करने के लिए कोई रास्ता नहीं लगता है। मैं प्लेसहोल्डर को अलग-अलग वास्तविक मूल्य को स्टाइल करना चाहता हूं, इसलिए यह भ्रमित प्रतीत नहीं होता है।

मैंने घटनाओं को देखा है और वास्तव में तत्व को कक्षा जोड़ सकता है, हालांकि जब वे पहली बार पृष्ठ पर प्रदर्शित होते हैं, तो उस वर्ग को जोड़ने के लिए कोई ईवेंट उपलब्ध नहीं होता है। इस बिंदु पर मैं प्रत्येक $ ('best_in_place') पर फिर से प्रयास करता हूं और अवधि में एचटीएमएल के शून्य मूल्य की तुलना करता हूं, हालांकि इससे पहले कि मैं ऐसा सोचूं कि मुझे कुछ याद आया है या नहीं।

तो क्या यह अंतर करने का कोई तरीका है कि एक मूल्य best_in_place के साथ सेट किया गया है?

यदि कोड आपको बेहतर समझता है: यह काम करता है, बस कक्षा को एक best_in_place में जोड़ता या हटा देता है, हालांकि यह केवल तभी सेट किया जाएगा जब उपयोगकर्ता क्षेत्र को संपादित करता है, न कि आंतरिक पृष्ठ लोड पर।

$('.best_in_place').bind('best_in_place:update', function(evt){ 
    if($(this).data('nil') == $(this).html()){ 
     $(this).removeClass('has_value'); 
    }else{ 
     $(this).addClass('has_value'); 
    } 
    }); 

Answer 1

उस कोड के लिए धन्यवाद। मैं

के साथ इस का समाधान मेरी example.js.erb में

$('.top-column .best_in_place').each(function() { 
    var element = $(this); 

    if(element.data('nil') != element.text()) { 
    updateBestInPlace($(this)); 
    } 
}); 

और example.js में

$(document).ready(function(){ 
    $('.top-column .best_in_place').live("ajax:success", function(){ 
    updateBestInPlace($(this)); 
    }); 
}); 

function updateBestInPlace(element){ 
    if(element.data('nil') == element.html() || element.html() == ""){ 
    element.removeClass('has_value'); 
    }else{ 
    element.addClass('has_value'); 
    } 
} 

Answer 2

एक बहुत ही सरल समाधान इस तरह, अपने :nil मूल्य में मार्कअप शामिल करने के लिए है:

= best_in_place @user, :email, nil: '<span class="none-yet">None yet!</span>' 

तो फिर तुम इस तरह एक सीएसएस नियम हो सकता है:

012,351,

.none-yet { 
    font-style: italic; 
} 

यह Git से संशोधन df178520bf9ba405baee9528d5dbb630d6ff760c साथ मेरे लिए काम कर रहा है: //github.com/bernat/best_in_place.git