Displaying symbols before and after text entry fields in one column only

Qualtrics.SurveyEngine.addOnReady(function () {
    // Get all the rows in the table body, i.e. excluding headers
    let all_rows = document.querySelectorAll("tbody tr");

    // Change it all_rows.length - 1, if you want to skip the totals row
    for (let i = 0; i < all_rows.length; i++) {
        let this_row = all_rows[i]; // Get the row

        // Get the relevant cell. Index starts from '0', but that stores statements
        // So, first input cell will be at location '1'
        // Suppose you only want to add it to the second cell
        // Not using 'input' here, as we want to add text before and after it
        this_row.cells[2].insertAdjacentHTML("afterbegin", "$");
        this_row.cells[2].insertAdjacentHTML("beforeend", ".00");

        // To add something to all cells in the row
        // Again, start from '1' to skip the statement column
        for (let j = 1; j < this_row.cells.length; j++) {
            // Using 'input' here, as we want to change it's style and not that of the cell
            this_row.cells[j].querySelector("input").style.width = "100px";
        }
    }
});

I've added some comments so that you can understand what's happening, and customize it further.

Thank you ahmedA for the code and additional comments. I can't seem to get it to work as is in either a Constant Sum type question, or Matrix-Constant Sum question; neither the dollar sign nor the cents display, and the field width appears to be the default size. I'll try to see if I can understand the code better and get it to work in my questions, but I appreciate the time you took to assist.

Do you have any additional JS? For debugging, the starting point is to open the console (ctrl+shift+i). Since the code isn't executing, it must be throwing an error (in red).

Thanks for your reply. Correction, it looks like the code IS executing, just not where I expected it to. I applied it to Question 7 in the image below, but it's showing up in the first row of the question above it. The image captures it with the Javascript I had in Question 6, but this still happens even after I removed Javascript from Q6 and all of the other questions in that block of the survey.

1. This may be due to some code you have in your header.


2. If not, please share the survey preview link of the question.

Thanks. I had some html in the Look & Feel header for the project title, and also used a custom Theme. But removing both of those does not change anything.
Here's a preview of the block if you are willing to take a look at it. https://surveys.ada.org/jfe/preview/SV_78wHq9SxrV6uGs6/BL_2beXWHnMRtwnp9r?Q_SurveyVersionID=current

Please change this line:
let all_rows = document.querySelectorAll("tbody tr");
To:
let all_rows = this.questionContainer.querySelectorAll("tbody tr");
This will ensure that the code works on per question basis. This give you more control, but with the overhead that you'll need to add JS to each question you want to customize.
The reason why the code isn't working for Q7 is that, there is no statement row, so instead of

this_row.cells[2]

this_row.cells[1]

Thank you! It's getting there. The symbols appear where they should be in the entry fields, but not in the read-only Total line.

Try replacing the relevant lines with these:
let target_cell = this_row.cells[1].querySelector(".SumTotal") || this_row.cells[1];
target_cell.insertAdjacentHTML("afterbegin", "$");
target_cell.insertAdjacentHTML("beforeend", ".00");

Thank you, that worked for my Matrix-Constant Sum question! Can this code be adapted to a Constant Sum question where I have a text entry field on the last line, that I don't want the dollar sign and cents to appear around? (See line 5 in the example below.)

I think you are using a combination of codes. With the code that I had provided, this shouldn't happen.

I just used an example of the previous code I found somewhere else for illustration purposes. When I tried to apply variations of the working code you provided (thank you again), nothing appears; see below. It seems like the code might not be executing, but I don't detect any errors when I debug.

Please share the preview link and the code you are using.

Here's a block preview. https://surveys.ada.org/jfe/preview/SV_78wHq9SxrV6uGs6/BL_7PpX8TMKx5dQLcx?Q_SurveyVersionID=current
In Question 10a I've applied most of the different variations of the code you shared above. This is the latest one I tried in the block preview above. Sorry for taking up your time, I'm probably too Javascript-illiterate to be trying to do this.
Qualtrics.SurveyEngine.addOnReady(function () {
  // Get all the rows in the table body, i.e. excluding headers
let all_rows = this.questionContainer.querySelectorAll("tbody tr");

  // Change it all_rows.length - 1, if you want to skip the totals row
  for (let i = 0; i < all_rows.length; i++) {
    let this_row = all_rows[i]; // Get the row

    // Get the relevant cell. Index starts from '0', but that stores statements
    // So, first input cell will be at location '1'
    // Suppose you only want to add it to the second cell
    // Not using 'input' here, as we want to add text before and after it
    this_row.cells[1].insertAdjacentHTML("afterbegin", "$");
    this_row.cells[1].insertAdjacentHTML("beforeend", ".00");

    // To add something to all cells in the row
    // Again, start from '1' to skip the statement column
    for (let j = 1; j < this_row.cells.length; j++) {
      // Using 'input' here, as we want to change it's style and not that of the cell
      this_row.cells[j].querySelector("input").style.width = "100px";
    }
  }
});

Thanks. I was afraid that the Constant Sum question was structured differently. I'm kind of locked into using Constant Sum for the questions in this block because it's the only question type I know of that will allow me to pipe the Total value into an entry field several blocks later in the survey. What I might do instead is to remove the Other write-in field in line 5 to a separate object altogether, and use code I have from an earlier iteration of this survey (and worked) to make the dollars and cents appear in the Constant Sum questions.
But I do appreciate the time and patience in helping me perfect a solution for the Matrix question; that was a major hurdle I could not get through the past two years I've set up this project. If you had a tip jar, I would make a contribution!

Thank you MatthewM you too kind, I'm glad we reached a solution.
A tip won't be necessary for this, if you ever have commercial work you can get in touch with me at www.survey-awesome.com

Sorry to bug you again, but I'm trying to get this last bit of code you shared to work in Question 1a at the link below. I must either be missing something, or the code doesn't work the same way in a Matrix that doesn't have a text field in the first column.

https://surveys.ada.org/jfe/preview/SV_78wHq9SxrV6uGs6/BL_6y62dEM2v4powJv?Q_SurveyVersionID=current

MatthewM I'm going to let you figure this one out, since I've already answered the question earlier.

OK, I guess it must be because the questions I tried to use them on don't have a text entry field in the first column.

Not exactly. I've shared two codes above, one for matrix, one for CS. It's because you're using the wrong code.

Oh, so this code is for Constant Sum questions? (My initial takeaway was that there was no code for Constant Sums.)