Значок DatePicker скрывается после выбора типа клиента (реализованный компонент ajax) в Wicket framework

Я создаю пользовательский интерфейс с использованием Wicket framework. Когда я нажимаю на «Регистрация клиента», новая страница загружается. и все выглядит хорошо. Значок выбора даты также присутствует, как показано на рисунке. Значок DatePicker скрывается после выбора типа клиента (реализованный компонент ajax) в Wicket framework

Я реализовал ajax по типу клиента. Когда я выбираю тип клиента, страница должна быть отображена. И после отображения значка выбора даты нет, как показано на рисунке.

HTML файл:

File Header

<head> 
    <wicket:head> 
    <script src="scripts/jquery/jquery-ui-1.8.17.custom.min.js"></script> 
    <script src="scripts/jquery/jquery.min.js"></script> 
    <script src="scripts/jquery/jquery-ui.min.js"></script> 
    <script src="scripts/jquery/jquery.maskedinput.js"></script> 
    <script> 
     jQuery(function($){ 
      $("#identityValue").mask("99999-9999999-9"); 
      $("#cnicBeneficial").mask("99999-9999999-9"); 
      $("#msisdn").mask("03999999999"); 
     }); 
    </script> 
    <script src="scripts/jquery/customization.js">function();</script> 

</wicket:head> 
</head>

и поле дата рождения и ДИВ

<div class="input" wicket:id="birthDateDiv"> 
<label for="birthDate"><wicket:message key="birthDate" /><span class="required">*</span></label> 
<input readonly="readonly" tabindex="6" type="text" size="10" wicket:id="birthDateField" id="birthDate" style="width: 150px;" /> 
</div>

Java код:

Заголовок:

final String chooseDtTxt = this.basePage.getLocalizer().getString(
     "datepicker.chooseDate", basePage); 

    add(new HeaderContributor(new IHeaderContributor() { 

     private static final long serialVersionUID = 1L; 

     @Override 
     public void renderHead(IHeaderResponse response) { 
     captcha = ""; 

     // localize the jquery datepicker based on users locale setting 
     // locale specific js includes for datepicker are available at 
     // http://jquery-ui.googlecode.com/svn/trunk/ui/i18n/ 
     String localeLang = getLocale().getLanguage().toLowerCase(); 

     LOG.debug("Using DatePicker for locale language: {}", 
      localeLang); 

     response.renderJavascriptReference("scripts/jquery/i18n/jquery.ui.datepicker-en.js"); 
     response.renderJavascriptReference("scripts/jquery/jquery.min.js"); 
     response.renderJavascriptReference("scripts/jquery/jquery-ui.min.js"); 
     response.renderJavascriptReference("scripts/jquery/jquery.maskedinput.js"); 
     response.renderJavascriptReference("scripts/jquery/customization.js"); 

     RenderJavaScriptComponent renderJavaScriptComponent = new RenderJavaScriptComponent(); 
     renderJavaScriptComponent.renderDateComponent(response, 
      "#birthDate", chooseDtTxt, true); 
     renderJavaScriptComponent.renderDateComponent(response, 
      "#cnicExpiryDate", chooseDtTxt, true, true); 


     } 
    }));

BirthdateField и Див

final WebMarkupContainer birthDateDiv = new WebMarkupContainer("birthDateDiv"); 

final DateTextField birthDateTextField = new DateTextField("birthDateField", new PropertyModel<Date>(
     this, "customer.birthDateString"), new PatternDateConverter(Constants.DATE_FORMAT_PATTERN_PARSE, false)); 
birthDateTextField.setOutputMarkupPlaceholderTag(true); 

birthDateDiv.add(birthDateTextField); 
birthDateDiv.setOutputMarkupPlaceholderTag(true); 
form.add(birthDateDiv);

и AjaxFormComponentUpdatingBehavior является:

customertypes.add(new AjaxFormComponentUpdatingBehavior("onchange") { 
    private static final long serialVersionUID = 1L; 

    @Override 
    protected void onUpdate(AjaxRequestTarget target) { 

    if (customer.getCustomerTypeId() != null){ 
     kycDiv.setVisible(true); 
     if(attachmentsPanel != null){ 
      attachmentsPanel.setVisible(true); 
     } 

     permanentAddressDiv.setVisible(true); 
     businessAddressDiv.setVisible(false); 

     switch(customer.getCustomerTypeId().intValue()){ 
     case (Constants.MBANKING_CUSTOMER_TYPE): 
        kycDiv.setVisible(false); 
     break; 

     case (Constants.STANDARD_CONSUMER): 
        kycDiv.setVisible(false); 
     break; 

     case (Constants.MERCHANT): 
     break; 

     case (Constants.MERCHANT_AGENT): 
        kycDiv.setVisible(false); 
     break; 

     case (Constants.BENEFICIARY): 
        kycDiv.setVisible(false); 
     break; 

     case (Constants.MERCHANT_HEADQUARTER): 
        accountProfileDiv.setVisible(false); 
        accountProfileMerchantDiv.setVisible(true); 
     break; 

     case (Constants.MERCHANT_DEALER): 
        kycDiv.setVisible(false); 
     break; 

     case (Constants.CONSUMER_WITH_FEE): 
        kycDiv.setVisible(false); 
     break; 

     case (Constants.CUSTOMER_TYPE_L1): 
     case (Constants.CUSTOMER_TYPE_L0): 
        kycDiv.setVisible(false); 
        accountProfileDiv.setVisible(false); 
        accountProfileMerchantDiv.setVisible(false); 
        businessDetailDiv.setVisible(false); 

        motherNameDiv.setVisible(true); 
        fatherHusbandNameDiv.setVisible(true); 
        placeOfBirthDiv.setVisible(true); 
        mailingAddressDiv.setVisible(true); 
        msisdnDiv.setVisible(true); 
        kvInfoModeDiv.setVisible(true); 
        landLineDiv.setVisible(true); 
        kvIdentityTypeDiv.setVisible(true); 
        cnicExpiryDateDiv.setVisible(true); 
        kvIdentityValueDiv.setVisible(true); 
        birthDateTextField.setVisible(true); 
        birthDateDiv.setVisible(true); 
        identityInfoTitleDiv.setVisible(true); 
        rolesAndPrivilegesDiv.setVisible(false); 

     break; 

     case (Constants.CUSTOMER_TYPE_L2_INDIVIDUAL_NEW): 
     case (Constants.CUSTOMER_TYPE_L2_INDIVIDUAL_10000): 
     case (Constants.CUSTOMER_TYPE_L2_INDIVIDUAL_50000): 
     case (Constants.CUSTOMER_TYPE_L2_INDIVIDUAL_99999): 
     case (Constants.CUSTOMER_TYPE_L2_INDIVIDUAL_500000): 

        kycDiv.setVisible(true); 
        accountsDiv.setVisible(false); 
        businessDetailDiv.setVisible(false); 
        accountProfileDiv.setVisible(true); 
        accountProfileMerchantDiv.setVisible(false); 
        salaryDiv.setVisible(false); 
        otherIncomeDiv.setVisible(false); 
        typeOfTransactionDiv.setVisible(false); 
        currentBusinessSinceDiv.setVisible(false); 
        premisesDiv.setVisible(false); 

        motherNameDiv.setVisible(true); 
        fatherHusbandNameDiv.setVisible(true); 
        placeOfBirthDiv.setVisible(true); 
        mailingAddressDiv.setVisible(true); 
        msisdnDiv.setVisible(true); 
        kvInfoModeDiv.setVisible(true); 
        landLineDiv.setVisible(true); 
        kvIdentityTypeDiv.setVisible(true); 
        cnicExpiryDateDiv.setVisible(true); 
        kvIdentityValueDiv.setVisible(true); 
        birthDateTextField.setVisible(true); 
        birthDateDiv.setVisible(true); 
        identityInfoTitleDiv.setVisible(true); 
        rolesAndPrivilegesDiv.setVisible(false); 

     break; 
     case (Constants.CUSTOMER_TYPE_AGENT_FINJA): 
     case (Constants.CUSTOMER_TYPE_L2_MERCHANT): 
        kycDiv.setVisible(true); 
        businessDetailDiv.setVisible(true); 
        permanentAddressDiv.setVisible(false); 
        accountProfileDiv.setVisible(false); 
        accountProfileMerchantDiv.setVisible(true); 
        salaryDiv.setVisible(true); 
        otherIncomeDiv.setVisible(true); 
        typeOfTransactionDiv.setVisible(true); 
        currentBusinessSinceDiv.setVisible(true); 
        premisesDiv.setVisible(true); 
        accountsDiv.setVisible(true); 
        typeOfCustomer_NotCustomerTypeDiv.setVisible(false); 
        purposeOfAccountDiv.setVisible(false); 
        bankRecognitionMediumDiv.setVisible(false); 
        modeOfTransactionDiv.setVisible(false); 

        motherNameDiv.setVisible(true); 
        fatherHusbandNameDiv.setVisible(true); 
        placeOfBirthDiv.setVisible(true); 
        mailingAddressDiv.setVisible(true); 
        msisdnDiv.setVisible(true); 
        kvInfoModeDiv.setVisible(true); 
        landLineDiv.setVisible(true); 
        kvIdentityTypeDiv.setVisible(true); 
        cnicExpiryDateDiv.setVisible(true); 
        kvIdentityValueDiv.setVisible(true); 
        birthDateTextField.setVisible(true); 
        birthDateDiv.setVisible(true); 
        identityInfoTitleDiv.setVisible(true); 
        rolesAndPrivilegesDiv.setVisible(false); 
     break; 

     case (Constants.CUSTOMER_TYPE_CST_SUB_AGENT): 
        kycDiv.setVisible(false); 
        businessDetailDiv.setVisible(false); 
        businessAddressDiv.setVisible(false); 
        permanentAddressDiv.setVisible(false); 
        accountProfileDiv.setVisible(false); 
        accountProfileMerchantDiv.setVisible(false); 
        salaryDiv.setVisible(false); 
        otherIncomeDiv.setVisible(false); 
        typeOfTransactionDiv.setVisible(false); 
        currentBusinessSinceDiv.setVisible(false); 
        premisesDiv.setVisible(false); 
        accountsDiv.setVisible(false); 
        typeOfCustomer_NotCustomerTypeDiv.setVisible(false); 
        purposeOfAccountDiv.setVisible(false); 
        bankRecognitionMediumDiv.setVisible(false); 
        modeOfTransactionDiv.setVisible(false); 

        motherNameDiv.setVisible(false); 
        fatherHusbandNameDiv.setVisible(false); 
        placeOfBirthDiv.setVisible(false); 
        mailingAddressDiv.setVisible(false); 
        msisdnDiv.setVisible(false); 
        kvInfoModeDiv.setVisible(false); 
        landLineDiv.setVisible(false); 
        kvIdentityTypeDiv.setVisible(false); 
        cnicExpiryDateDiv.setVisible(false); 
        kvIdentityValueDiv.setVisible(false); 
        birthDateDiv.setVisible(false); 
        identityInfoTitleDiv.setVisible(false); 
        rolesAndPrivilegesDiv.setVisible(true); 
     break;  

     case (Constants.CUSTOMER_TYPE_GUEST): 
        kycDiv.setVisible(false); 
        attachmentsPanel.setVisible(false); 
     break; 

     default : 
     break; 
     } 

    }else{ 
    } 

    target.addComponent(kycDiv); 
    target.addComponent(accountProfileDiv); 
    target.addComponent(accountProfileMerchantDiv); 

    target.addComponent(businessDetailDiv); 
    target.addComponent(permanentAddressDiv); 

    target.addComponent(businessNameDiv); 
    target.addComponent(ntnNumberDiv); 
    target.addComponent(businessAddressDiv); 

    target.addComponent(salaryDiv); 
    target.addComponent(otherIncomeDiv); 
    target.addComponent(typeOfTransactionDiv); 
    target.addComponent(currentBusinessSinceDiv); 
    target.addComponent(premisesDiv); 

    target.addComponent(monthlyExpectedDepositDiv); 
    target.addComponent(monthlyExpectedWithdrawalDiv); 
    target.addComponent(expectedAvgBalanceDiv); 
    target.addComponent(annualTurnoverDiv); 
    target.addComponent(expectedMonthlyCreditSalesDiv); 

    target.addComponent(averageMonthlyInflowDiv); 
    target.addComponent(averageMonthlyOutflowDiv); 
    target.addComponent(averageYearlySalesDiv); 
    target.addComponent(avergaeYearlyIncomeDiv); 

    target.addComponent(typeOfCustomer_NotCustomerTypeDiv); 
    target.addComponent(purposeOfAccountDiv); 
    target.addComponent(bankRecognitionMediumDiv); 
    target.addComponent(modeOfTransactionDiv); 

    target.addComponent(infoModeSMSEmail); 
    target.addComponent(motherNameDiv); 
    target.addComponent(fatherHusbandNameDiv); 
    target.addComponent(placeOfBirthDiv); 

    target.addComponent(msisdnDiv); 
    target.addComponent(kvInfoModeDiv); 
    target.addComponent(landLineDiv); 
    target.addComponent(kvIdentityTypeDiv); 
    target.addComponent(cnicExpiryDateDiv); 
    target.addComponent(kvIdentityValueDiv); 
    target.addComponent(birthDateTextField); 
    target.addComponent(birthDateDiv); 
    target.addComponent(mailingAddressDiv); 
    target.addComponent(identityInfoTitleDiv); 


    if(attachmentsPanel != null){ 
     target.addComponent(attachmentsPanel); 
    } 

    } 
});

Полный код (HTML и Java) файлы также загружен на этой ссылке http://pastebin.com/Dr92A9Vq

источник

2017-02-09 Abdul Majid Bajwa

Ваш AjaxFormComponentUpdatingBehavior добавляет «РОЖДЕНИЕ» компонент в AjaxRequestTarget, заменяя его разметку в браузере.

Это возвращается независимо следующая строка сделала:

renderJavaScriptComponent.renderDateComponent(response, "#birthDate", chooseDtTxt, true);

варианта:

сделать ваш DateField «реальный» компонент, то есть пусть позаботиться о добавлении необходимого JavaScript
обновить всю панель, когда изменяется тип клиента, так что вкладки заголовка восстанавливаются после обновления Ajax:

target.add (RegisterCustomerPanel.this);

Обновление: Почему DateField не является «реальным» компонентом?

Потому что это не самодостаточно. Когда вы обновляете его через Ajax, он все равно должен функционировать. Это не так, потому что он зависит от панели с поддержкой JavaScript.

источник

2017-02-09 14:11:48 svenmeier

datefield - это реальный компонент, datefield просто получает каландр из файла javascript. и если я хочу обновить всю панель, как я могу это сделать? Можете ли вы рассказать о двух моментах с примером, пожалуйста? –

Я расширил свой ответ. – svenmeier

В моем случае я добавлю ** target.addComponent (form); ** потому что основной div wicket id является ** registerCustomerForm **, а отображение этого div в java является ** final Form form = new Form ("registerCustomerForm ", \t \t новый CompoundPropertyModel (this)); ** я прав? –

Значок DatePicker скрывается после выбора типа клиента (реализованный компонент ajax) в Wicket framework

ответ

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