Take the 2-minute tour ×
Code Review Stack Exchange is a question and answer site for peer programmer code reviews. It's 100% free, no registration required.

I have a website which has reviews about games. Right now, to list the advantages (+) and disadvantages (-) of that game, there's a textarea in the admin panel with a WYSIWYG editor with only element. So my users list their (+) with list elements :

<ul>
    <li>Game is too slow</li>
    <li>Game is very hard</li>
</ul>

I want to update it and I was wondering if it wouldn't be a better way to have input fields to add their (+) and (-) about the game and each time they want to add one, they click on a button which adds an input field. Then, when the form is submitted, I could encode the datas with JSON like :

[
    ['Game is too slow'],
    ['Game is very hard']
]

Would be like:

<input name="advantages[]" /> <a href="#" data-add>+</a>
<script>
$('[data-add]').click(function(){
    $(this).before('<br /><input name="advantages[]" />')
});
</script>

and then:

// encode    
$list = json_encode($_POST['advantages']);
//decode
echo '<ul>';
foreach($list as $item) {
    echo '<li>'.$item.'</li>';
}
echo '</ul>';

And when I want to show the datas, I could decode them and display them as a list, which would be like the first option. My point would be to get rid of the WYSIWYG and maybe have a more flexible system.

What do you think?

share|improve this question

1 Answer 1

up vote 3 down vote accepted

First of all, there's a problem with the HTML approach you have:

  • That's risky (XSS most of the time)
  • Do you expect them to be web developers? I can be a gamer/reviewer with zero HTML knowledge.
  • We're writing a review, we should only write reviews, not HTML. Leave HTML to the developers.

Now, as you said, you can do JSON, and your other approach seems to be right:

Form

<form>
  <h3>Advantages</h3>
  <button>Add</button> // get nextAll advantages, find the last and append after
  <input type="text" name="advantages[]" />
  <input type="text" name="advantages[]" />
  <input type="text" name="advantages[]" />

  <h3>Disadvantages</h3>
  <button>Add</button> // get nextAll disadvantages, find the last and append after
  <input type="text" name="disadvantages[]" />
  <input type="text" name="disadvantages[]" />
  <input type="text" name="disadvantages[]" />
</form>

Data structure to server

{
  advantages : ['foo','bar','baz'],
  disadvantages : ['foo','bar','baz']
}
share|improve this answer
    
In fact, I'm just updating a code which I didn't write so I know that it was not the good approach and that's why I want to change. Thank you for your answer, I didn't even think about XSS. I think I'll do it with JSON then ;). –  Codel96 Feb 24 at 3:22

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.