INSERTing unknown number of items

tgavin · August 4, 2007

I have a simple form - a text field and a textarea - for news articles. The number of articles depends upon the user. The form starts with 1 article, and if the user wants to add more will click on a button (for now it's text) to add another article to the form. If you try using the code below, you'll see more clearly what I mean.

My problem is now getting that info and inserting it into the articles table. I'm not sure how to go about splitting, or exploding or whatever needs to be done to assign each posted article (the text field and textarea combo constitutes an article) an ID number and insert it in the appropriate manner.

CREATE TABLE `articles` (
`art_id` INT UNSIGNED NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`newsletter_id` INT UNSIGNED NOT NULL ,
`art_headline` VARCHAR( 255 ) NOT NULL ,
`art_txt` TEXT NOT NULL ,
) ENGINE = MYISAM ;

<?php
if(isset($_POST['submit'])) {
    $conn = mysql_connect('localhost', 'username', 'password') or trigger_error(mysql_error(),E_USER_ERROR);
    mysql_select_db('database', $conn) or die(mysql_error());
    
    foreach($_POST as $key=>$value) {
        // just testing here
        echo "Key: $key; Value: $value<br />\n";
        //$query = mysql_query("INSERT INTO articles (newsletter_id,art_headline,art_txt) VALUES ('".$_POST['newsletter_id']."','".$_POST[$key]."','".$_POST[$value]."')") or die(mysql_error());
    }
}
?>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
var elCount = 2;
function add() {
    var parent = document.getElementById('parent');
    var article = document.createElement('DIV');
        article.id = 'article_' + elCount;
        article.name = 'article_' + elCount;
    var article_title_label = document.createElement('LABEL');
        article_title_label.appendChild(document.createTextNode('Title ' + elCount + ': '));
    var article_title_text = document.createElement('INPUT');
        article_title_text.id = 'article_' + elCount + '_title';
        article_title_text.name = 'article_' + elCount + '_title';
    var article_textarea = document.createElement('TEXTAREA');
        article_textarea.id = 'article_' + elCount + '_content';
        article_textarea.name = 'article_' + elCount + '_content';
    var article_remove_a = document.createElement('A');
        article_remove_a.appendChild(document.createTextNode('Remove'));
        article_remove_a.href = 'javascript:remove(\'article_' + elCount + '\');';
        article.appendChild(article_title_label);
        article.appendChild(article_title_text);
        article.appendChild(document.createElement('BR'));
        article.appendChild(article_textarea);
        article.appendChild(document.createElement('BR'));
        article.appendChild(article_remove_a);
        parent.appendChild(article);
        elCount++;
}

function remove(el) {
    if(typeof(el) == 'string')
        el = document.getElementById(el);
    var parent = el.parentNode;
    parent.removeChild(el);
}
</script>
</head>
<body>
<form action="add.php" method="post">
<div id="parent">
	<div id="article_1">
		<label for="article_1_title" style="float:left; width:80px">Headline 1: </label><input type="text" name="article_1_title" id="article_1_title" /><br />
		<label for="article_1_content" style="float:left; width:80px">Article 1: </label><textarea name="article_1_content" id="article_1_content"></textarea><br />
		<a href="javascript:remove('article_1');">Remove this article</a>
	</div>
</div>
<a href="javascript:add();">Add another article</a><br />
<input type="hidden" name="newsletter_id" value="32" />
<input type="submit" name="submit" value="submit">
</form>
</body>
</html>

Sign In

INSERTing unknown number of items

Recommended Posts

tgavin

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information