2016-02-18 1 views
0

Я совершенно новый в JQuery, поскольку я использовал только javascript.JQuery/Javascript выполняет только первое условие (на странице visualforce с вершиной: выходная панель)

Я пытаюсь выполнить функцию jquery, но он выполняет только первое условие в коде (первый IF). Второй (второй IF) никогда не выполняется. У меня должно быть что-то не так, и я извиняюсь, если что-то очевидно. Следующий код - это функция JQuery, которая внедряется на страницу visualforce (вот почему синтаксис идентификатора компонента).

$(function() { 
$("#datepicker").datepicker({ dateFormat: 'dd/mm/yy' }); 
$("#datepicker2").datepicker({ dateFormat: 'dd/mm/yy' }); 
if(document.getElementById('{!$Component.mainform.inputDATE}').value != null){ 
    var obj = document.getElementById('{!$Component.mainform.inputDATE}').value; 
    $("#datepicker").val(obj); 
    alert("obj: "+obj); 
} 
if(document.getElementById('{!$Component.mainform.inputDATE2}').value != null){ 
    var obj2 = document.getElementById('{!$Component.mainform.inputDATE2}').value; 
    $("#datepicker2").val(obj2); 
    alert("obj2: "+obj2); 
}  
}); 

Любой совет будет очень благодарен. Я тестировал по-разному, но выполняется только первое условие.

+0

Не могли бы вы предоставить jsFiddle с соответствующим HTML и (возможно) CSS? –

+0

Вы проверили консоль на наличие ошибок? отладка javascript на chrome довольно проста – Phiter

+0

Код не имеет видимых синтаксических ошибок. Вы уверены, что второе условие дает положительный результат? –

ответ

0

Спасибо за комментарии, я обнаружил, что никаких проблем с функцией jquery нет. Проблема была связана с фактической, visualforce. На странице visualforce я могу разделить его на разделы и отобразить, если в соответствии с определенной функцией. Пример:

<apex:outputpanel rendered="{!objOrder.Id!=''}" > 
    <apex:inputHidden id="inputDATE" value=" {!objOrder.Required_Date__c}" />   
    <input type="text" id="datepicker"/> 
</apex:outputpanel> 

<apex:outputpanel rendered="{!objOrder.Id==''}" > 
    <apex:inputHidden id="inputDATE2" value=" {!objOrder.Required_Date__c}" />   
    <input type="text" id="datepicker2"/> 
</apex:outputpanel> 

Итак, я предполагаю, что функция Jquery в верхней части страницы, не признает, если один из этих входных воздастся или нет, и это никогда не работает второе условие (первое условие является более распространенным)

$(function() { 
$("#datepicker").datepicker({ dateFormat: 'dd/mm/yy' }); 
$("#datepicker2").datepicker({ dateFormat: 'dd/mm/yy' }); 
if(document.getElementById('{!$Component.mainform.inputDATE}').value != null){ 
    var obj = document.getElementById('{!$Component.mainform.inputDATE}').value; 
    $("#datepicker").val(obj); 
    alert("obj: "+obj); 
} 
if(document.getElementById('{!$Component.mainform.inputDATE2}').value != null){ 
    var obj2 = document.getElementById('{!$Component.mainform.inputDATE2}').value; 
    $("#datepicker2").val(obj2); 
    alert("obj2: "+obj2); 
}  
}); 

Так что я сделал, и прошу прощения, если не следовать передовой практике, был разделить функции Jquery на две части и embeed в раздел, который принадлежит. Таким образом, он выполнит обе функции. Конечный код это один:

<apex:outputpanel rendered="{!objOrder.Id!=''}" > 
    <apex:inputHidden id="inputDATE" value=" {!objOrder.Required_Date__c}" />   
    <input type="text" id="datepicker"/> 
    <script> 
$(function() { 
$("#datepicker").datepicker({ dateFormat: 'dd/mm/yy' }); 
if(document.getElementById('{!$Component.mainform.inputDATE}').value != null){ 
    var obj = document.getElementById('{!$Component.mainform.inputDATE}').value; 
    $("#datepicker").val(obj); 
    alert("obj: "+obj); 
} 
}); 
    </script> 
</apex:outputpanel> 

<apex:outputpanel rendered="{!objOrder.Id==''}" > 
    <apex:inputHidden id="inputDATE2" value=" {!objOrder.Required_Date__c}" />   
    <input type="text" id="datepicker2"/> 
    <script> 
    $(function() { 
    $("#datepicker2").datepicker({ dateFormat: 'dd/mm/yy' }); 
    if(document.getElementById('{!$Component.mainform.inputDATE2}').value != null){ 
    var obj2 = document.getElementById('{!$Component.mainform.inputDATE2}').value; 
    $("#datepicker2").val(obj2); 
    alert("obj2: "+obj2); 
}  
}); 
    </script> 
</apex:outputpanel> 

Я надеюсь, что это может помочь кому-то в будущем, испытывающим проблемы между оказанной и отдела продаж JQuery.

Спасибо за помощь ... !!!

Смежные вопросы