首页 > 解决方案 > 使用 HTML ID 进行 Xpages 部分刷新

问题描述

我有一个具有 onChange 功能的 InputText。该函数触发一个带有部分刷新的 HTML 组件。这个 DIV 中的 EveryClass 效果很好。但是如果 refreshID 是 XPages 设计元素部分刷新工作正常但 CSS 类不能。例如。在这个例子中,具有名为“card”的类的 div,当我单击它时它会折叠并展开。首次加载页面时效果很好,但在部分刷新后折叠和展开不起作用。我不想使用完全刷新,因为我添加了加载指示器,它适用于部分刷新,不适用于完全刷新。有什么办法可以解决这个问题。如果有人有线索,我可以分享完整的代码..谢谢

<xp:div id="Results" styleClass="card">
 <div class="card-header bg-transparent header-elements-inline">
     <span class="card-title font-weight-semibold">
         Find What you are looking for...
     </span>
     <div class="header-elements">
      <div class="list-icons">
         <a href="#" class="list-icons-item"> <i class="icon-help"></i>  </a>
         <a class="list-icons-item" data-action="collapse"> </a>
         <a class="list-icons-item" data-action="remove"> </a>
      </div>
     </div>
    </div>
    <div class="card-body">
     <div class="form-group form-group-feedback form-group-feedback-left">
      <xp:inputText style="width:100%;" id="CompanyName" value="#{viewScope.CompanyName}" styleClass="form-control border-success-300 border-1"> <xp:this.attrs>
     <xp:attr name="placeholder" value="What is it You looking for?">
     </xp:attr>
    </xp:this.attrs>
    <xp:typeAhead mode="full" minChars="2" ignoreCase="true" valueList="#{javascript:getCustomersList();}"> </xp:typeAhead>
     <xp:eventHandler event="onchange" submit="true" refreshMode="partial"
      refreshId="Results"> <xp:this.action><![CDATA[#{javascript:getSearchResults(viewScope.CompanyName)}]]></xp:this.action>
 </xp:eventHandler></xp:inputText>
     <div class="form-control-feedback"> <i class="mt-2 icon-reading text-muted"> </i> </div> </div> 
  <div class="">
     <xp:comboBox id="Staff" value="#{viewScope.Staff}" styleClass="form-control"> <xp:this.disabled><![CDATA[#{javascript:viewScope.CompanyName=="" || viewScope.CompanyName==null; }]]></xp:this.disabled>
     <xp:selectItems> <xp:this.value><![CDATA[#{javascript:viewScope.Staff}]]></xp:this.value> </xp:selectItems>
     <xp:eventHandler event="onchange" submit="true" refreshMode="partial" refreshId="Results"> <xp:this.action><![CDATA[#{javascript:var fName = viewScope.CompanyName;var uName = viewScope.Staff;
getUrunDetails(fName, uName)}]]></xp:this.action>                                           </xp:eventHandler></xp:comboBox></div><div class="">
 <xp:label value="Lastest Order Date:" id="label3" styleClass="col-form-label"></xp:label></div> <div class=""><xp:inputText id="LatestOrderDate" value="#{viewScope.LatestOrderDate}" styleClass="text-right form-control border-success-300 border-1" disabled="true">
 </xp:inputText> </div>  </div>
</xp:div>

更新-2

<div id="view:_id1:_id1766:Results" class="card">
<div class="card-header bg-transparent header-elements-inline"><span class="card-title font-weight-semibold">Ara...</span>
<div class="header-elements"><div class="list-icons"><a class="list-icons-item" href="#"><i class="icon-help"></i></a>
<a class="list-icons-item" data-action="collapse"></a><a class="list-icons-item" data-action="remove"></a></div></div></div>
<div class="card-body"><div class="form-group form-group-feedback form-group-feedback-left">
<span id="view:_id1:_id1766:_id2717" dojotype="ibm.xsp.widget.layout.data.TypeAheadReadStore" jsid="view__id1__id1766__id2717" minchars="2" mode="full"></span>
<div class="dijit dijitReset dijitInline dijitLeft dijitTextBox dijitComboBox dijitValidationTextBox form-control border-success-300 border-1" id="widget_view:_id1:_id1766:FirmaAdi" role="combobox" aria-haspopup="true" data-dojo-attach-point="_popupStateNode" lang="en" widgetid="view:_id1:_id1766:FirmaAdi" style="width: 100%;"><div class="dijitReset dijitRight dijitButtonNode dijitArrowButton dijitDownArrowButton dijitArrowButtonContainer" data-dojo-attach-point="_buttonNode" role="presentation" style="display: none;"><input class="dijitReset dijitInputField dijitArrowButtonInner" value="▼ " type="text" tabindex="-1" readonly="readonly" role="button presentation" aria-hidden="true"></div><div class="dijitReset dijitValidationContainer"><input class="dijitReset dijitInputField dijitValidationIcon dijitValidationInner" value="Χ " type="text" tabindex="-1" readonly="readonly" role="presentation"></div><div class="dijitReset dijitInputField dijitInputContainer"><input class="dijitReset dijitInputInner" name="view:_id1:_id1766:FirmaAdi" type="text" autocomplete="off" data-dojo-attach-point="textbox,focusNode" role="textbox" tabindex="0" id="view:_id1:_id1766:FirmaAdi" value="DÖKTAŞ DÖKÜMCÜLÜK TİC VE SAN. A.Ş." aria-invalid="false"><span class="dijitPlaceHolder dijitInputField" style="display: none;">Ne Aramıştınız?</span></div></div><div class="form-control-feedback"><i class="mt-2 icon-reading text-muted"></i></div></div><div><select id="view:_id1:_id1766:Urun" name="view:_id1:_id1766:Urun" class="form-control" size="1">  <option value="Staff 0</option>
    <option value="Staff 1</option>
    <option value="Staff 2</option>
    <option value="Staff 3</option>
</select></div><div>
<label id="view:_id1:_id1766:label3" class="col-form-label">Son Sipariş:<a id="view:_id1:_id1766:link14" href="http://portal/xspFrmProposal.xsp?action=editDocument&amp;documentId=FD0F115C68C2BD52432586950040A419" class="text-right mr-2 ml-2 r text-primary list-icons-item" target="_blank" data-popup="popover" data-trigger="hover" data-content="DÖKTAŞ DÖKÜMCÜLÜK TİC VE SAN. A.Ş. ye ait Sözleşme Formuna git..." data-original-title="Müşteri Bilgilerine Git" data-placement="bottom"><i class="icon-link2"></i></a></label></div><div><input type="text" value="11.03.2021 15:26:49" id="view:_id1:_id1766:SiparisTarihi" name="view:_id1:_id1766:SiparisTarihi" disabled="disabled" class="text-right form-control border-success-300 border-1"></div><div><label class="col-form-label">Son Teklif:<a id="view:_id1:_id1766:link12" href="http://portal.acarermetal.com.tr/ays/crm.nsf/xspFrmTeklif.xsp?action=editDocument&amp;documentId=38ED7907DE9CFAD943258693003E7D3F" class="text-right mr-2 ml-2 r text-primary list-icons-item" target="_blank" data-popup="popover" data-trigger="hover" data-content="DÖKTAŞ DÖKÜMCÜLÜK TİC VE SAN. A.Ş. ye ait son teklif formuna git..." data-original-title="Müşteri Bilgilerine Git" data-placement="bottom"><i class="icon-link2"></i></a></label></div><div><input type="text" value="09.03.2021" id="view:_id1:_id1766:TeklifTarihi" name="view:_id1:_id1766:TeklifTarihi" disabled="disabled" class="text-right form-control border-success-300 border-1"></div><div><label class="col-form-label">Son Teklif Verilen Malzemeler:</label><textarea name="view:_id1:_id1766:Urunt" data-dojo-attach-point="focusNode,containerNode,textbox" autocomplete="off" class="dijitTextBox dijitTextArea dijitExpandingTextArea form-control elastic elastic-destroy dijitTextBoxDisabled dijitTextAreaDisabled dijitExpandingTextAreaDisabled dijitDisabled" tabindex="-1" lang="en" disabled="" aria-disabled="true" id="view:_id1:_id1766:Urunt" rows="1" widgetid="view:_id1:_id1766:Urunt" value="2 Ton FEMO 16995usd

" style="overflow: auto hidden; box-sizing: border-box; min-height: 72px; height: 68px;"></textarea></div></div></div>

标签: xpagesindicatorpartial-refresh

解决方案


推荐阅读