So I have the following form:

<form>

  <input type="button" value="1" >
  <input type="button" value="2">
  <input type="button" value="3">
  <input type="button" value="4">

  <button>Create account</button>

</form>

Those values are to choose a package from a database (those are the IDs). But on the screen I don't want them to display a number but a name (basic, advanced, pro, pro ). Is it possible to have a value and display a different text?

CodePudding user response：

Use a button element:

<form>
  <button type="button" value="1">Basic</button>
  <button type="button" value="2">Advanced</button>
  <button type="button" value="3">Pro</button>
  <button type="button" value="4">Pro </button>

  <button>Create account</button>

</form>

<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response：

You can use input type radio for choose a different type of value.

<form action="/action_page.php">
<label><input type="radio" name="radio" value="1"> Basic </label>
<label><input type="radio" name="radio" value="1"> Advanced </label>
<label><input type="radio" name="radio" value="3"> Pro</label>
<label><input type="radio" name="radio" value="4"> Pro   </label>
<button type="submit">Create account</button>
</form>

<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response：

style a placeholder or data-attribute, or a for= label.