Jump to content

incremental number for each table row


wkilc
 Share

Go to solution Solved by mac_gyver,

Recommended Posts

Hi,

 

I am trying to modify some code to add a simple number increment to my results.  There are tutorials galore, but the problem is the way the original code is set-up this way:

{        
    $XXX = 1;

    $op1 .= '<table>';
    $op1 .= '<tr><td><input type="text" name="School'.$XXX.'" /></td>
         <td><input type="text" name="Student'.$XXX.'" /></td>
         <td><input type="text" name="Class'.$XXX.'" /></td>
         </tr>';
        $XXX++;
    }
    $op1 .= '</table>';
}

<?= $op1; ?>

This is the result:

<table>
<tr><td><input type="text" name=School1"></td>
<td><input type="text" name=Student1"></td>
<td><input type="text" name=Class1"></td>
</tr>
<tr><td><input type="text" name=School1"></td>
<td><input type="text" name=Student1"></td>
<td><input type="text" name=Class1"></td>
</tr>
<tr><td><input type="text" name=School1"></td>
<td><input type="text" name=Student1"></td>
<td><input type="text" name=Class1"></td>
</tr>
</table>

I tried: 

<td><input type="text" name="School'.$XXX++.'" />

but this returns:

<table>
<tr><td><input type="text" name=School1"></td>
<td><input type="text" name=Student2"></td>
<td><input type="text" name=Class3"></td>
</tr>
<tr><td><input type="text" name=School1"></td>
<td><input type="text" name=Student2"></td>
<td><input type="text" name=Class3"></td>
</tr>
<tr><td><input type="text" name=School1"></td>
<td><input type="text" name=Student2"></td>
<td><input type="text" name=Class3"></td>
</tr>
</table>

I am looking for:

<table>
<tr><td><input type="text" name=School1"></td>
<td><input type="text" name=Student1"></td>
<td><input type="text" name=Class1"></td>
</tr>
<tr><td><input type="text" name=School2"></td>
<td><input type="text" name=Student2"></td>
<td><input type="text" name=Class2"></td>
</tr>
<tr><td><input type="text" name=School3"></td>
<td><input type="text" name=Student3"></td>
<td><input type="text" name=Class3"></td>
</tr>
</table>

Apologies if I am not explaining this correctly or if I did not post enough info.

 

Thanks in advance.

Edited by wkilc
Link to comment
Share on other sites

  • Solution

actually, naming form fields (variables, db column names, or anything else) with an incremental number is a bad design that takes more code to produce the markup and process the data.

 

you should use an array name for the form fields.  - name="School[]", name="Student[]", and name="Class[]".

 

this will submit the data as a php array for those field names, that you can simply loop over and access the values from each set of form fields within the group.

Edited by mac_gyver
Link to comment
Share on other sites

His database is full of numbered columns as well, and we've pointed that out many times in the last months – obviously without him making any progress whatsoever.

 

I'm afraid it's one of those cases where you just have to wait for the person to get replaced and the application to be thrown away.

Link to comment
Share on other sites

No, you dont "Got it". @mac_gyver gave you the correct response.

 

Using tables for page layout went out in the 90's. You need to use CSS.

 

While I agree that the OP's use of names is not the way to go, and that something like entities[] should be used, I do feel tables still have a good use when a table is desired as shown by the OP.

Link to comment
Share on other sites

Guys, it's 2016. The last time table layouts made sense was before HTML 4 somewhere in the mid-90s.

 

In those 20 years, a lot has changed: HTML is now a semantic language, which means its sole purpose is to describe the logical structure of a document. It has nothing to do with stylistic information. That's what CSS is for. CSS offers all the layouts you want; yes, you can even emulate your beloved table layout (display: table).

 

HTML tables are for tabular data. They do not exist for any stylistic purposes. When you're using tables to align text or inject newlines, that's plain wrong. 

Link to comment
Share on other sites

I am not saying tables should ever be used for layout.  Or am I? :).  So, I am assuming we agree the following is acceptable as it is being used solely for tabular data?  What if I wanted the same thing, but also wish each of the data elements to be a link?  Still okay?  Or not a link, but each is inline editable? Or inputs as the OP showed?  Are they not all being used for tabular content?

<table>
    <tr>
        <td>School1</td>
        <td>Student1</td>
        <td>Class1</td>
    </tr>
    <tr>
        <td>School2</td>
        <td>Student2</td>
        <td>Class2</td>
    </tr>
    <tr>
        <td>School3</td>
        <td>Student3</td>
        <td>Class3</td>
    </tr>
</table>
Link to comment
Share on other sites

Your example isn't data. A form isn't data. I'm not sure why this is so hard to understand, but tabular data looks like this:

 username | registration date | number of posts
----------+-------------------+-----------------
 foo      | 2016-01-16        | 383
 bar      | 2016-06-05        | 41
 baz      | 2016-03-21        | 163

Those are records holding information and sharing a common structure. That's what you use tables for. You do not use tables to align your form inputs.

Link to comment
Share on other sites

Looks like tabular data to me.  Of course, you need to imagine that some parent actually named their child "Student1".

+-------------+--------------+-------------+
| School Name | Student Name | Class Level |
+-------------+--------------+-------------+
| School1     | Student1     | Class1      |
| School2     | Student2     | Class2      |
| School3     | Student3     | Class3      |
+-------------+--------------+-------------+
Link to comment
Share on other sites

Just to beat this to death.  Would this be wrong?

+------------------------+-----------------+-------+
|      School Name       | Class President | Grade |
+------------------------+-----------------+-------+
| Washington High School | Linda Smith     | INPUT |
| Clinton High School    | Bob Reed        | INPUT |
| Lincoln High School    | John Lee        | INPUT |
+------------------------+-----------------+-------+
Link to comment
Share on other sites

No. The first two columns are clearly tabular data, and it makes sense to integrate the input fields into the table.

 

The point we're trying to make is that using tables without any tabular data for the sole purpose of aligning the content is an anti-pattern. You can see that in the OP's code.

Link to comment
Share on other sites

For what it's worth, I agree with NotionCommotion. While the data doesn't exist yet, the form is asking the user to enter tabular data.

 

What if the form fields are populated with some entries for the user to edit? Would you use an HTML table then? You have tabular data. It's just presented through form fields.

Link to comment
Share on other sites

You seemed to have missed the "General Form Accessibility" from page 1.

 

"Make sure that the order in which form elements are accessed is logical and easy. This can sometimes be problematic if tables are used to control layout of form items."

 

From what I briefly read, that site is not advocating using tables for form layout for accessibility and in fact leans to the opposite. As far as tables in the link you provided, that sections focus is "Handling Multiple Labels" and not about using a table for ease of accessibility. There is nothing about using a table for accessibility leverage.

 

The answer is still no, do not use tables for form layout.

Edited by benanamen
Link to comment
Share on other sites

From what I briefly read, that site is not advocating using tables for form layout for accessibility and in fact leans to the opposite. As far as tables in the link you provided, that sections focus is "Handling Multiple Labels" and not about using a table for ease of accessibility. There is nothing about using a table for accessibility leverage.

 

The article is titled "Creating Accessible Forms". ARIA, the technique described in the article, was created to make web content more accessible to those using assistive devices. The <label> tag is used to connect a form label to the corresponding input field, making the form more accessible since the assistive devices do not need to guess which label goes with which field. The introduction on the page talks about the shortcomings of the <label> tag. And then goes on to show an ARIA method that takes the HTML table to make the form accessible.

Link to comment
Share on other sites

From the same site. I rest my case.

 

http://webaim.org/techniques/tables/

 

That pages talks about how assisitve devices work with regular HTML tables, which don't have special markup. It explains why layout tables can be bad, which I agree with. But we're not talking about layout tables, at least not in my opinion.

Edited by cyberRobot
  • Like 1
Link to comment
Share on other sites

Also, that accessible tables article says the following:

In reality, layout tables do not pose inherent accessibility issues. There are certainly many worse things that you could do in terms of accessibility. People with all kinds of disabilities can easily access layout tables, as long as the tables are designed with accessibility in mind - ensuring proper linearized reading order, content scaling, etc.

 

 

As far as I'm aware, the main reasons layout tables should be avoided is twofold. Tables can be problematic for people that use assistive technologies. And CSS is now widely supported, so using HTML tables to layout a page is no longer the best option. Is there something I missed that would suggest that tables cannot be used in a scenario like the OP put forth?

Link to comment
Share on other sites

This thread is more than a year old.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.