Регистрация  |  Вход

outputfield + inlineeditsupport + javascript

вот на 100% описано и моя проблема и есть решение
http://www.faqoverflow.com/salesforce/9435.html
решение работает для случая когда просто в поле что нибудь печатаем, если поле более сложное типа lookup, dependent picklist, rich text area, короче всё что на инлайн эдит открывает маленький pop-up - не работает.

проблема такова - я хочу сделать на кастомной странице inlineEdit
по сути всё что мне надо - вызвать javascript из outputfield+inlineeditsupport на onchange (или на двойном клике), проблема в том что в обоих нет нативной подержки AJAXa , actionsupport я тоже не смог заставить заработать.

есть какието другие варианты как можно было бы это сделать?

важно - поля у меня не индивидуальные а выводятся из настроек, то есть хотелось бы какоето generic решение, конкретное ID конкретного поля сложновато будет найти, но буду рад любым идеям, особенно если удастся убрать apex:pageBlockSectionItem, изза него label теряются

примеры кода

//обычный вывод поля
<apex:outputField value="{!objName[field.field__c]}"/>


//попытка прикрутить инлайн эдит с поддержкой onedit javascript function call
//сама функция
$(document).ready(function() {
$('.inlineMYClass :hidden').change(function(e) {
alert('function was called');
});
});
//поле
<apex:pageBlockSectionItem dataStyleClass="inlineMYClass">
<apex:outputLabel value="{!field.Custom_Field_Label__c}"/>
<apex:outputField value="{!objName[field.field__c]}">
<apex:inlineEditSupport event="ondblclick" resetFunction="resetInlineEdit"/>
</apex:outputField>
</apex:pageBlockSectionItem>

повторюсь - решение работает, если поле можно менять прямо внутри поля, если поле открывает popup - не работает. Особенно это заметно на lookup - пишем что нибудь внутри лукапа - функция вызывается, нажимаем на лупу и находим рекорд там - ставим рекорд - функция не вызывается.

вот на 100% описано и моя проблема и есть решение 
http://www.faqoverflow.com/salesforce/9435.html
решение работает для случая когда просто в поле что нибудь печатаем, если поле более сложное типа lookup, dependent picklist, rich text area, короче всё что на инлайн эдит открывает маленький pop-up - [b]не работает[/b]. 

проблема такова - я хочу сделать на кастомной странице inlineEdit
по сути всё что мне надо - вызвать javascript из outputfield+inlineeditsupport на onchange (или на двойном клике), проблема в том что в обоих нет нативной подержки AJAXa , actionsupport я тоже не смог заставить заработать. 

есть какието другие варианты как можно было бы это сделать?

важно - поля у меня не индивидуальные а выводятся из настроек, то есть хотелось бы какоето generic решение, конкретное ID конкретного поля сложновато будет найти, но буду рад любым идеям, особенно если удастся убрать apex:pageBlockSectionItem, изза него label теряются

примеры кода

[code]
//обычный вывод поля
 <apex:outputField value="{!objName[field.field__c]}"/> 


//попытка прикрутить инлайн эдит с поддержкой onedit javascript function call
//сама функция
    $(document).ready(function() {
      $('.inlineMYClass :hidden').change(function(e) {
          alert('function was called');
      });
    });
//поле
<apex:pageBlockSectionItem dataStyleClass="inlineMYClass">
<apex:outputLabel value="{!field.Custom_Field_Label__c}"/>
<apex:outputField value="{!objName[field.field__c]}">
<apex:inlineEditSupport event="ondblclick" resetFunction="resetInlineEdit"/> 
</apex:outputField>
</apex:pageBlockSectionItem>[/code]

повторюсь - решение работает, если поле можно менять прямо внутри поля, если поле открывает popup - не работает. Особенно это заметно на lookup - пишем что нибудь внутри лукапа - функция вызывается, нажимаем на лупу и находим рекорд там - ставим рекорд - функция не вызывается.

Андрей
Особенно это заметно на lookup - пишем что нибудь внутри лукапа - функция вызывается, нажимаем на лупу и находим рекорд там - ставим рекорд - функция не вызывается.

Проинспектируй сам лукап, там просто несколько инпутов, можешь повесь событие на другой инпут итп

[quote="Андрей"]Особенно это заметно на lookup - пишем что нибудь внутри лукапа - функция вызывается, нажимаем на лупу и находим рекорд там - ставим рекорд - функция не вызывается.[/quote]
Проинспектируй сам лукап, там просто несколько инпутов, можешь повесь событие на другой инпут итп

<apex:page docType="html-5.0" sidebar="false" showHeader="false" standardStylesheets="true" cache="false" standardController="Contact">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script>
$(document).ready(function() {
window.oldPick = window.lookupPick;
window.lookupPick = function(a,b,c,d,e,f,g,l) {
console.log(a);
console.log(b);
console.log(c);
console.log(d);
console.log(e);
console.log(f);
console.log(g);
console.log(l);
window.oldPick(a,b,c,d,e,f,g,l);
}
});
</script>
<apex:form styleClass="inlineMYClass">
<apex:outputField value="{!Contact.accountId}" id="inp">
<apex:inlineEditSupport event="ondblclick" resetFunction="resetInlineEdit"/>
</apex:outputField>
</apex:form>


</apex:page>

[code]<apex:page docType="html-5.0" sidebar="false" showHeader="false" standardStylesheets="true" cache="false" standardController="Contact">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

    <script> 
    $(document).ready(function() {
            window.oldPick = window.lookupPick;
            window.lookupPick = function(a,b,c,d,e,f,g,l) {
                console.log(a);
                console.log(b);
                console.log(c);
                console.log(d);
                console.log(e);
                console.log(f);
                console.log(g);
                console.log(l);
                window.oldPick(a,b,c,d,e,f,g,l);
            }
    });
    </script>
<apex:form styleClass="inlineMYClass">
<apex:outputField value="{!Contact.accountId}" id="inp">
    <apex:inlineEditSupport event="ondblclick" resetFunction="resetInlineEdit"/> 
</apex:outputField>
</apex:form>


</apex:page>[/code]

не знаю как работает стандартный inline edit и как это сделать по SF-way.
НО по колхозному можно сделать так:
вывести outputField и inputField рядом.
inputField скрыть.
повесить хендлер на даблклик чтобы поля outputField подменялся на inputField
повесить хендлер (или кнопочку рядом save замутить) для обработки завершения редактирования (тут уже вариантов море).
наслаждаться творением

не знаю как работает стандартный inline edit и как это сделать по SF-way.
НО по колхозному можно сделать так:
вывести outputField и inputField рядом.
inputField скрыть.
повесить хендлер на даблклик чтобы поля outputField подменялся на inputField
повесить хендлер (или кнопочку рядом save замутить) для обработки завершения редактирования (тут уже вариантов море).
наслаждаться творением :) 

<apex:page docType="html-5.0" sidebar="false" showHeader="false" standardStylesheets="true" cache="false" standardController="Contact">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<apex:form>
<apex:outputField value="{!Contact.LastName}" id="name">
<apex:inlineEditSupport event="ondblclick" resetFunction="resetInlineEdit"/>
</apex:outputField>
<apex:outputField value="{!Contact.accountId}" id="inp">
<apex:inlineEditSupport event="ondblclick" resetFunction="resetInlineEdit"/>
</apex:outputField>

</apex:form>
<script>
InlineEditField.SimpleField.prototype.updateFieldValue = function (a, b) {
console.log('bingo');
console.log(a);
console.log(b);
this.isDifferentValue(a) ? (this.changed || (this.changed = !0, addStyleClass(this.readDiv, "inlineEditModified")), this.currentValue = a, b || this.updateDependents(), this.updateReadElement()) : this.changed && this.reset(!0)
};
</script>

</apex:page>

Думаю на этом тему можно закрывать.

[code]<apex:page docType="html-5.0" sidebar="false" showHeader="false" standardStylesheets="true" cache="false" standardController="Contact">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

    <apex:form>
        <apex:outputField value="{!Contact.LastName}" id="name">
            <apex:inlineEditSupport event="ondblclick" resetFunction="resetInlineEdit"/> 
        </apex:outputField>
        <apex:outputField value="{!Contact.accountId}" id="inp">
            <apex:inlineEditSupport event="ondblclick" resetFunction="resetInlineEdit"/> 
        </apex:outputField>

    </apex:form>
    <script>
        InlineEditField.SimpleField.prototype.updateFieldValue = function (a, b) {
            console.log('bingo');
            console.log(a);
            console.log(b);
            this.isDifferentValue(a) ? (this.changed || (this.changed = !0, addStyleClass(this.readDiv, "inlineEditModified")), this.currentValue = a, b || this.updateDependents(), this.updateReadElement()) : this.changed && this.reset(!0)
        };
    </script>

</apex:page>[/code]

Думаю на этом тему можно закрывать.

widler
спасибо , inlineEditModified меня сильно продвинул вперед, очень близко к тому что надо. есть проблема - я не могу понять как это работает
мне надо не просто вызвать а вызвать с параметром (или както проследить какой обьект меняется) и я не могу добавть это в твой код.
вот тут почитал про inlineEditModified
http://stackoverflow.com/questions/2664045/how-to-get-an-html-elements-style-values-in-javascript

в общем что я реально пытаюсь сделать - передать в javascript и сохранить имена обьектов которые юзер поменял через inlineEdit, т.к. на странице 6 типов обьектов и сохранять все 6 ужасно плохо по производительности

у страницы есть EDIT mode и там выводится так :
<apex:inputField onchange="iqPartner.editDetailUpdatedTrue('Opportunity');return false;" value="{!VALUE}" label="LABEL"/>

то есть я пытался сымитировать этот самый вызов javascript с параметром для обычного режима - параметр это обьект который поменялся. Т.е. в своём решении номер 1 я сделал 6 стилей и 6 функций
$(document).ready(function() {
$('.inlineMYClass1 :hidden').change(function(e) {
alert('function was called');
});
});
$(document).ready(function() {
$('.inlineMYClass2 :hidden').change(function(e) {
alert('function was called');
});
});
и т.д.
а как в твоем решении передать параметр в функцию или разделить слежение я не понимаю
когда я увидел что добавляется inlineEditModified я попытался сделать так:

<apex:outputField value="{!Opportunity[field.field__c]}" label="{!field.Custom_Field_Label__c}" StyleClass="inlineOpportunityClass">
<apex:inlineEditSupport showOnEdit="inlineSaveButton, inlineCancelButton" disabled="{!IF(NOT(field.editable__c), true, false)}" event="ondblclick" resetFunction="resetInlineEdit"/>
</apex:outputField>
//функция которую потом вызываю по кнопке
iqPartner.debugStyles = function() {
$('.inlineEditModified').each(function(){
console.log($(this));
});
return false;
}

т.е. мне бы подошло если я бы прямо в SAVE пробегал бы по всем inlineEditModified если бы я мог получить стиль или какуюто инфу по том какому обьекту принадлежит поле и потом сохранить только те которые реально были inlinemodified
внутри THIS нету "inlineOpportunityClass" или я не понимаю как дотянуться

widler
спасибо , inlineEditModified меня сильно продвинул вперед, очень близко к тому что надо. есть проблема - я не могу понять как это работает :(
мне надо не просто вызвать а вызвать с параметром (или както проследить какой обьект меняется) и я не могу добавть это в твой код. 
вот тут почитал про inlineEditModified
http://stackoverflow.com/questions/2664045/how-to-get-an-html-elements-style-values-in-javascript

в общем что я реально пытаюсь сделать - передать в javascript и сохранить имена обьектов которые юзер поменял через inlineEdit, т.к. на странице 6 типов обьектов и сохранять все 6 ужасно плохо по производительности

у страницы есть EDIT mode и там выводится так :
<apex:inputField onchange="iqPartner.editDetailUpdatedTrue('Opportunity');return false;" value="{!VALUE}"  label="LABEL"/>

то есть я пытался сымитировать этот самый вызов javascript с параметром для обычного режима - параметр это обьект который поменялся. Т.е. в своём решении номер 1 я сделал 6 стилей и 6 функций
 $(document).ready(function() {
      $('.inlineMYClass1 :hidden').change(function(e) {
          alert('function was called');
      });
    });
 $(document).ready(function() {
      $('.inlineMYClass2 :hidden').change(function(e) {
          alert('function was called');
      });
    });
и т.д.
а как в твоем решении передать параметр в функцию или разделить слежение я не понимаю
когда я увидел что добавляется inlineEditModified я попытался сделать так:
[code]<apex:outputField value="{!Opportunity[field.field__c]}" label="{!field.Custom_Field_Label__c}" StyleClass="inlineOpportunityClass">
<apex:inlineEditSupport showOnEdit="inlineSaveButton, inlineCancelButton" disabled="{!IF(NOT(field.editable__c), true, false)}" event="ondblclick" resetFunction="resetInlineEdit"/> 
</apex:outputField>
//функция которую потом вызываю по кнопке 
    iqPartner.debugStyles = function() {
        $('.inlineEditModified').each(function(){
            console.log($(this));
        });
        return false;
    }[/code]

т.е. мне бы подошло если я бы прямо в SAVE пробегал бы по всем inlineEditModified если бы я мог получить стиль или какуюто инфу по том какому обьекту принадлежит поле и потом сохранить только те которые реально были inlinemodified
внутри THIS нету "inlineOpportunityClass" или я не понимаю как дотянуться

Андрей
в общем что я реально пытаюсь сделать - передать в javascript и сохранить имена обьектов которые юзер поменял через inlineEdit, т.к. на странице 6 типов обьектов и сохранять все 6 ужасно плохо по производительности

я не совсем понял в чем проблема. Сделай свой массив с измененными данными и заполняй его из моей функции. Потом по Save выбирай все из этого массива и все.

работает это все очень просто. Я взял и переназначил стандартный метод салесфорс на свою функцию....

[quote="Андрей"]в общем что я реально пытаюсь сделать - передать в javascript и сохранить имена обьектов которые юзер поменял через inlineEdit, т.к. на странице 6 типов обьектов и сохранять все 6 ужасно плохо по производительности[/quote]

я не совсем понял в чем проблема. Сделай свой массив с измененными данными и заполняй его из моей функции. Потом по Save выбирай все из этого массива и все.

работает это все очень просто. Я взял и переназначил стандартный метод салесфорс на свою функцию....

ок я вроде сумел сделать, корректно выводит консоль лог, дальше дело техники
еще раз спасибо за inlineEditModified
вот как то так по итогу

<apex:outputField value="{!Opportunity[field.field__c]}"  label="{!field.Custom_Field_Label__c}">
<apex:inlineEditSupport showOnEdit="inlineSaveButton, inlineCancelButton" disabled="{!IF(NOT(field.editable__c), true, false)}" event="ondblclick" resetFunction="resetInlineEdit" changedStyleClass="inlineOpportunityClass"/>
</apex:outputField>

//когда save то ловлю каждый класс отдельно примерно так
iqPartner.debugStyles = function() {
$('.inlineOpportunityClass').each(function(){
console.log($(this));
});
return false;
}

причем если изменить ченить - функция срабатывает. если по кнопке откатить назад - корректно показывает что изменений нет. короче идеально. только надо 6 раз вызвать $('.inlineOpportunityClass').each(function(){ в поиске наших 6 классов

ок я вроде сумел сделать, корректно выводит консоль лог, дальше дело техники
еще раз спасибо за inlineEditModified
вот как то так по итогу 

[code]<apex:outputField value="{!Opportunity[field.field__c]}"  label="{!field.Custom_Field_Label__c}">
<apex:inlineEditSupport showOnEdit="inlineSaveButton, inlineCancelButton" disabled="{!IF(NOT(field.editable__c), true, false)}" event="ondblclick" resetFunction="resetInlineEdit" [b]changedStyleClass="inlineOpportunityClass"[/b]/> 
</apex:outputField>

//когда save то ловлю каждый класс отдельно примерно так
    iqPartner.debugStyles = function() {
        $('.inlineOpportunityClass').each(function(){
            console.log($(this));
        });
        return false;
    }[/code]

причем если изменить ченить - функция срабатывает. если по кнопке откатить назад - корректно показывает что изменений нет. короче идеально. только надо 6 раз вызвать $('.inlineOpportunityClass').each(function(){ в поиске наших 6 классов

wilder
Андрей
в общем что я реально пытаюсь сделать - передать в javascript и сохранить имена обьектов которые юзер поменял через inlineEdit, т.к. на странице 6 типов обьектов и сохранять все 6 ужасно плохо по производительности

я не совсем понял в чем проблема. Сделай свой массив с измененными данными и заполняй его из моей функции. Потом по Save выбирай все из этого массива и все.

работает это все очень просто. Я взял и переназначил стандартный метод салесфорс на свою функцию....


я вроде наконец разобрался, спасибо

[quote="wilder"][quote="Андрей"]в общем что я реально пытаюсь сделать - передать в javascript и сохранить имена обьектов которые юзер поменял через inlineEdit, т.к. на странице 6 типов обьектов и сохранять все 6 ужасно плохо по производительности[/quote]

я не совсем понял в чем проблема. Сделай свой массив с измененными данными и заполняй его из моей функции. Потом по Save выбирай все из этого массива и все.

работает это все очень просто. Я взял и переназначил стандартный метод салесфорс на свою функцию....[/quote]
я вроде наконец разобрался, спасибо