Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to format text of option values inside of a select tag?

I have a list of table items that when a copy button is pressed, all the table items concatenate into one text box, get selected, and get put on windows clipboard.

Boxes are formatted like so:

<tr>
  <td>Name of Person:</td>
  <td><textarea name="name" rows="2" cols="30" id="name"></textarea></td>
</tr>
<tr>
  <td>Type of Service:</td>
  <td><select name="drop1" id="txt_drop1">
      <option value="">None</option>
      <option value="Type of Service: Minimal">Minimal</option>
      <option value="Type of Service: Normal">Normal</option>
      <option value="Type of Service: Full">Full</option>
      <option value="Type of Service: Premium">Premium</option>
    </select></td>
</tr>
<tr>
  <td>Dollar Amount:</td>
  <td><textarea name="amount" rows="1" cols="30" id="txt_info2"></textarea></td>
</tr>
<tr>
<td><textarea name="bigtextbox" rows="5" cols="30" id="txt_info2"></textarea></td>
</tr>

What I need is the formatting, in that when the copy button is pressed, the resulting text concatenates in a neat manner. I can make it happen like so:

Name: John
Type of Service: Full
Amount: $125

But I also need to not line break if no option is selected in the drop down box, like so:

Name: John
Amount: $125

Instead of:

Name: John

Amount: $125

Is there a way to apply formatting code such as '\n' to the value of the option? Right now all my non box textboxes are formatted in the concatenate code after the copy button is clicked, ex:

    <input type="button" style="font-weight:bold;" name="clipboard_copy" value="Copy" onClick="document.data_entry.bigtextbox.value = 'Name:&nbsp;' + document.data_entry.name.value + '\n' + document.data_entry.drop1.value + '\n' + 'Amount: $' + document.data_entry.amount.value>
like image 695
Justin Tennant Avatar asked Nov 12 '22 04:11

Justin Tennant


1 Answers

Probably I didn't understand you. I thought you wanted to change option element format into the select element. If you want to achieve that format after pressing the button, you can try this:

<input type="button" style="font-weight:bold;" name="clipboard_copy" value="Copy"
onClick="document.data_entry.bigtextbox.value = 'Name:&nbsp;' + 
document.data_entry.name.value + (document.data_entry.drop1.value.trim().length 
=== 0) ? '' : '\n' + document.data_entry.drop1.value + '\n' + 'Amount: $' + 
document.data_entry.amount.value">

I added this line to your button example:

(document.data_entry.drop1.value.trim().length === 0) ? '' : '\n' + 
document.data_entry.drop1.value

This checks (you can check whatever condition you want. I just used this to check if you have selected "blank", for example) if your select has a value. If does not have a value, it sets '' to your "response" text. If it contains something, it will add '\n' + document.data_entry.drop1.value.

like image 54
DaGLiMiOuX Avatar answered Nov 15 '22 01:11

DaGLiMiOuX