表单提交后在同一成功消息中显示两个 id#

Question

i am trying to display text field val along with the val of a select field in a success message after form has submitted

This retuns the select field val. how would i store and add another val in same string

<script>
// when the DOM is ready
$(document).ready(function() {
  // store a reference to the select field 
  const $budget = $('#budget');
  // store budget
  const $bookingForm = $('#booking-form');
  // store success text field in the $successText variable
  const $successText = $('.insert-success-text');
  
  let customSuccessMessage = $budget.val();

  // select field changes
  $budget.change(function(){
    // assign the new selected option
    customSuccessMessage = $(this).val();
  });

  // when the form's submit button is clicked 
  $bookingForm.submit(function(e){
     // if 
    if(customSuccessMessage){
      // find .insert-success-text and add this text 
      $successText.text(`Thank you 'Thank you **text field val*** for your intrest in a ${customSuccessMessage}`);
      // then submit the form
      return true;
    }
    else{   // else if no option was selected
      // focus on the select field
      $budget.focus();
      // stop form submission
      return false;
    }
  });  
});
</script>

Answer 1

I modified the code above.

<script>
$(document).ready(function() {
  const $budget = $('#budget');
  const $textField = $('#text-field');
  const $bookingForm = $('#booking-form');
  const $successText = $('.insert-success-text');
  
  let customSuccessMessage = $budget.val();

  $budget.change(function(){
    customSuccessMessage = $(this).val();
  });
  $bookingForm.submit(function(e){
    if(customSuccessMessage){
     
      $successText.text(`Thank you ${$textField.val()} for your interest in a ${customSuccessMessage}`);
      return true;
    }
    else{   
      $budget.focus();
      return false;
    }
  });  
});
</script>