0

I've Googled this and browsed through SO and Programmers.stackexchange and not found a mention.

Background: I'm working on a project where the users and the designer would like me to truncate the text I output to an updateable form for visual appeal. They don't want the text to be cut off by the end of the input field and want the text in the box to fit the length of the box.

Problem: I know how to truncate the strings and I know how to get my script to ignore fields that weren't updated. What I don't know how to do is keep the data integrity from breaking down when users start updating the fields. Because the fields would no longer contain the full value, this seems like it would introduce serious flaws when I update the database.

Question: Is there any way that I can give them what they want in terms of a truncated presentation, and then cause the full text of each input to appear if they try to edit that input... or do I just have to go back and say "What you want can't be done?" I'm open to other suggestions too. :)

Improve this question
1
  • The reason you couldn't search fruitfully for this is that you have a very broad requirement that you have not broken down into individual technical components. Commented Feb 28, 2012 at 16:24

3 Answers 3

Reset to default
2

I think you may be looking for the text-overflow CSS property.

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Maybe I'm not implementing it correctly, but this still seems to result in the clipping at the end of the box instead of at the end of a word inside the limit.
@AlexC it's late/early and my eyes are tired but I don't believe I saw that requirement in your question.
Sorry I wasn't clear. That's what I meant when I said "They don't want the text to be cut off by the end of the input field and want the text in the box to fit the length of the box." I thought I was being clear, as the text already cuts itself off in an input box without any styling needed. I'll try to be clearer in the future. If it was late/early for you when you wrote, I hope you read this after a nice sleep. :)
1

If I understand correctly, you have a few challenges here. You need to display some data in the form truncated, which is relatively simple. You also need to make the data display in full if it's edited, and also substitute in full data for truncated data when the form is submitted, but avoid wiping out changes that your users have made.

You could do this with jQuery. Display the truncated data, but use .data() to store the full data. Also use .data() to store a flag on each field so you know if it has been edited or not. When a field gets focus, sub in the full data. When the form is submitted, check each field's flag to see if it's been edited. If it has, leave it alone. If the data has not been edited, remove the field contents and swap in the full length data. Then submit the form.

You'll present truncated data, allow the full data to be edited, and avoid submitting the truncated data if it's not edited.

Improve this answer

1 Comment

OK, this is sounding more doable. I just started learning jQuery, but this is the closest thing to what I'm looking for I've seen yet. Let me dig in a bit and see if this.
1

I would consider something along the lines where you keep properties that contains the truncated string and the fulls string, and use the truncated string for display purposes. When they click into the form field, you could replace it with the full string. If there are no changes, then the value of the input would match the full string property. Along that principal, if they didn't change anything replace it, with the truncated string again.

If they have edited anything, you could then dynamically create an edited property to store the edited version of the string from the input field.

Basically at this point it would just be some simple property tests/equality checks.

Improve this answer

2 Comments

This is along the right lines, I'm just trying to figure out the strategy of "How" to do it. Thanks
It's all in your implementation. It might help if you start off with only one form field, and thus only one object to store the various ways the text could be formatted. Use an object and give it's key the name of the form field, for easier referencing. Start of small, and once you get it working for one, expand your basic test until you work up to your real life situation.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.