Home > Software engineering >  Why does the value of the select tag always remain on the first option even after saving?
Why does the value of the select tag always remain on the first option even after saving?

Time:08-16

I have a form that allows users to change their account details (name, surname, nickname etc ..), everything works correctly and the saves are done in the right way.

Now, I have a select tag that allows the user to select their nickname, this is just different combinations of their first and last name. Whichever option the user chooses is saved correctly, subsequently anywhere on the site the user is able to see the nickname just as he or she chose to view it.

The problem is that the select tag always shows the first available option and not the last choice made by the user. Is there a way to tell the select tag to stay on the last option chosen by the user so that here too the user can see the nickname just as he selected it ?

This is the part of the form I'm working on

<!-- Nickname -->
    <p >
      <label  for="account_display_name"><?php esc_html_e( 'Display name', 'woocommerce' ); ?>&nbsp;<span >*</span></label>
      <!-- input type="text"  name="account_display_name" id="account_display_name" value="<?php echo esc_attr( $user->display_name ); ?>" /> <span ><?php esc_html_e( 'This will be how your name will be displayed in the account section and in reviews', 'woocommerce' ); ?></span -->
    
      <select  name="account_display_name" id="account_display_name">
        <option value="<?php echo esc_attr( $user->first_name ); ?>"><?php echo esc_attr( $user->first_name ); ?></option>
        <option value="<?php echo esc_attr( $user->last_name ); ?>"><?php echo esc_attr( $user->last_name ); ?></option>
        <option value="<?php echo esc_attr( $user->first_name ); echo esc_attr( $user->last_name ); ?>"><?php echo esc_attr( $user->first_name ); echo esc_attr( $user->last_name ); ?></option>
        <option value="<?php echo esc_attr( $user->last_name ); echo esc_attr( $user->first_name ); ?>"><?php echo esc_attr( $user->last_name ); echo esc_attr( $user->first_name ); ?></option>
      </select> <span ><?php esc_html_e( 'This will be how your name will be displayed in the account section and in reviews', 'woocommerce' ); ?></span>
    </p>

This is the whole form

<form name="Form"  action="" method="post" <?php do_action( 'woocommerce_edit_account_form_tag' );?> >

    <?php do_action( 'woocommerce_edit_account_form_start' ); ?>
    <!-- Nome & Cognome -->
    <div >
      <p >
        <label  for="account_first_name"><?php esc_html_e( 'First name', 'woocommerce' ); ?>&nbsp;<span >*</span></label>
        <input type="text" placeholder="Inserisci il tuo nome"  name="account_first_name" id="account_first_name" autocomplete="given-name" value="<?php echo esc_attr( $user->first_name ); ?>" /> 
      </p>
      <p >
        <label  for="account_last_name"><?php esc_html_e( 'Last name', 'woocommerce' ); ?>&nbsp;<span >*</span></label>
        <input type="text" placeholder="Inserisci il tuo cognome"  name="account_last_name" id="account_last_name" autocomplete="family-name" value="<?php echo esc_attr( $user->last_name ); ?>" />
      </p> 
    </div>
  
    <div ></div>

    <!-- Username per l'accesso -->
    <p >
      <label  for="account_user_login"><?php esc_html_e( 'Username', 'woocommerce' ); ?></label>
      <input type="text"  name="account_user_login" id="account_user_login" disabled value="<?php echo esc_attr( $user->user_login ); ?>" /> <span ><?php esc_html_e( "L'username viene scelto dall'utente al momento della registrazione, esso viene utilizzato insieme alla password per effettuare l'accesso al sito e non può essere modificato. Se la registrazione dell'account avviene tramite social login, l'username viene generato automaticamente. ", 'woocommerce' ); ?></span>
    </p>

    <!-- Nickname (nome visualizzato nel sito) -->
    <p >
      <label  for="account_display_name"><?php esc_html_e( 'Display name', 'woocommerce' ); ?>&nbsp;<span >*</span></label>
      <!-- input type="text"  name="account_display_name" id="account_display_name" value="<?php echo esc_attr( $user->display_name ); ?>" /> <span ><?php esc_html_e( 'This will be how your name will be displayed in the account section and in reviews', 'woocommerce' ); ?></span -->
    
      <select  name="account_display_name" id="account_display_name">
        <option value="<?php echo esc_attr( $user->first_name ); ?>"><?php echo esc_attr( $user->first_name ); ?></option>
        <option value="<?php echo esc_attr( $user->last_name ); ?>"><?php echo esc_attr( $user->last_name ); ?></option>
        <option value="<?php echo esc_attr( $user->first_name ); echo esc_attr( $user->last_name ); ?>"><?php echo esc_attr( $user->first_name ); echo esc_attr( $user->last_name ); ?></option>
        <option value="<?php echo esc_attr( $user->last_name ); echo esc_attr( $user->first_name ); ?>"><?php echo esc_attr( $user->last_name ); echo esc_attr( $user->first_name ); ?></option>
      </select> <span ><?php esc_html_e( 'This will be how your name will be displayed in the account section and in reviews', 'woocommerce' ); ?></span>
    </p>

    <div ></div>

    <!-- Campo email -->
    <p >
      <label  for="account_email"><?php esc_html_e( 'Email address', 'woocommerce' ); ?>&nbsp;<span >*</span></label>
      <input type="email"  name="account_email" id="account_email" autocomplete="email" value="<?php echo esc_attr( $user->user_email ); ?>" />
    </p>

    <!-- Password Section -->
    <div id="editpw" >Modifica Password<i ></i></div>
    <div >
      <fieldset>  
        <p>
          <label  for="password_current"><?php esc_html_e( 'Current password (leave blank to leave unchanged)', 'woocommerce' ); ?></label>
          <div >
            <input type="password"  name="password_current" id="password_current" autocomplete="off"/>
            <input type="checkbox"  id="pw_current" onclick="showPassword('password_current')"/>
            <label for="pw_current" ></label>
          </div>
        </p>

        <p>
          <label  for="password_1"><?php esc_html_e( 'New password (leave blank to leave unchanged)', 'woocommerce' ); ?></label>
          <div >
            <input type="password"  name="password_1" id="password_1" autocomplete="off"/>
            <input type="checkbox"  id="pw_1" onclick="showPassword('password_1')"/>
            <label for="pw_1" ></label>
          </div>
          <div ></div>
        </p>

        <p>
          <label  for="password_2"><?php esc_html_e( 'Confirm new password', 'woocommerce' ); ?></label>
          <div >
            <input type="password"  name="password_2" id="password_2" autocomplete="off" />
            <input type="checkbox"  id="pw_2" onclick="showPassword('password_2')"/>
            <label for="pw_2" ></label>
          </div>
        </p>
      </fieldset>
    </div>

    <div ></div>

    <?php do_action( 'woocommerce_edit_account_form' ); ?>
    
    <div > <!--******** START CONTAINER BUTTON ********-->
      <p>
        <?php wp_nonce_field( 'save_account_details', 'save-account-details-nonce' ); ?>
        <button type="submit"  name="save_account_details" value="<?php esc_attr_e( 'Save changes', 'woocommerce' ); ?>"><?php esc_html_e( 'Salva modifiche', 'woocommerce' ); ?></button>
        <input type="hidden" name="action" value="save_account_details" />
      </p>
      <?php do_action( 'woocommerce_edit_account_form_end' ); ?>
  </form>

CodePudding user response:

The display_name column in the wp_posts table contains the currently chosen display name -- the results of the choice your user made in the pulldown menu. That choice can happen either in your form or in the form on the user-edit page.

So, if you want to show the current choice in your pulldown menu as the default, you must look at the display_name, then put the selected attribute on the <option...> that matches it.

Here is now wp-admin/user-edit.php does it. Notice the call to selected() at line 501.

selected( $profile_user->display_name, $item )
  • Related