Topic: How to send tags data in a form ?
Hello,
I'm interrested by using the tags functionnality, but I don't see how can I retrieve there data when I send my form?
I try in PHP to do a "var_dump($_POST');" but nothing appears about tags.
I though about using the chips events to for example add the value in an hidden field each time a new tag is created, but I think there is a better/easier method?
So, could you help me please? :)
Thanks,
Jerome Ouvrard
Hi,
If you want to add value to tags try using <?php echo "your value" ?> inside <span>
Best,
Adam
Hello,
Sorry, my question was not clear. :)
For example in your support forum when we ask a question, we can add some tags to "categorize" our problem. After that, we can see these tags on the right column so, the values were send with the form.
I tried to do a form with these same tags but with no result. When I submit my form I can't retrieve the tags values, Nothing appears in the $_POST variable about that.
Thanks,
Jerome
Adam Jakubowski staff pro premium priority commented 5 years ago
Okay,
I see you have a problem with php and connecting the form but unfortunately I can't help you because I'm not a php specialist.
However, if you would like to learn more about this topic, I can help you with wordpress solutions that we support https://mdbootstrap.com/education/wordpress/
Sekra24 pro commented 5 years ago
I don't think it is a PHP related problem. He want's to add the values of the chips to the payload of the form submit.
You can scroll down here: https://mdbootstrap.com/docs/jquery/components/badges/ and use the $('.chips-initial').materialChip('data'); method. But it does not work for me in the current version of mdb 4.8.8. Maybe a developer could check this?
Greetings.
jouvrard pro commented 5 years ago
Yes, it's exactly my problem. I'll try some tests this evening, for example by putting the "$('.chips-initial').materialChip('data');" return value in an hidden field when I click on "submit" to see if I can retrive the values.
Adam Jakubowski staff pro premium priority commented 5 years ago
if you want to get something similar like on our support, you can use this https://yaireo.github.io/tagify/
I did a small test to try to retrieve these values without using tagify but only your component.
Here is my code, it works:
<form action="tags.php" method="post">
<div class="chips chips-placeholder"></div>
<div id="myTags"></div>
<div>
<input type="submit" value="Envoyer" name="Submit">
</div>
</form>
And the javascript:
$('.chips-placeholder').materialChip({
placeholder: 'Enter a tag',
secondaryPlaceholder: '+Tag',
});
var chipClass = $('.chips');
var nbChip = 1;
chipClass.on('chip.add', function(e, chip){
$('#myTags').append('<input type="hidden" name="mytags[]" value="' + chip.tag + '" id="' + nbChip + '">');
nbChip++;
});
With this code, each time you create a chip, an hidden field is Added in the form with the value.In the "$_POST" variable you'll find mytags" with all the values (it's an array).
I'll add what is necessary to delete a chip later.
Jerome
Here is a functionnal code:
If you add a chip, an hidden field is Added in your form
If you delete a chip, the associated field is deleted too
$('.chips-placeholder').materialChip({
placeholder: 'Enter a tag',
secondaryPlaceholder: '+Tag',
});
var chipClass = $('.chips');
var nbChip = 1;
chipClass.on('chip.add', function(e, chip){
$('#myTags').append('<input type="hidden" name="mytags[]" value="' + chip.tag + '" id="chip_' + nbChip + '">');
nbChip++;
});
chipClass.on('chip.delete', function(e, chip){
$('input[value="' + chip.tag + '"]').remove();
});
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.8.8
- Device: All
- Browser: All
- OS: All
- Provided sample code: No
- Provided link: No