FM Design
Would you like to react to this message? Create an account in a few clicks or log in to continue.

IMPORTANT

FM Design is in read-only mode, please click here for more information.

Latest topics
» Forumactif Edge - Releases
by Ange Tuteur Tue 03 Sep 2019, 11:49

» GIFActif - Giphy Button for the Editor
by Ange Tuteur Wed 08 May 2019, 17:21

» Forum Closure
by Ange Tuteur Mon 01 Jan 2018, 01:28

» Chit Chat Thread
by Valoish Sun 31 Dec 2017, 19:15

» Font/Text background color.
by Valoish Sun 31 Dec 2017, 19:11

» Forumactif Messenger - Instant Message Application for Forumotion
by Wolfuryo Sun 31 Dec 2017, 18:24

» [GAME] Count to One Million!
by brandon_g Fri 29 Dec 2017, 18:58

» Post Cards
by manikbiradar Wed 20 Dec 2017, 07:50

» [GAME] Countdown from 200,000
by Valoish Wed 13 Dec 2017, 23:22

» GeekPolice Tech Support Forums - GeekPolice.net
by Dr Jay Mon 11 Dec 2017, 19:12

» Asking about some plugin for Forumotion
by Dr Jay Mon 11 Dec 2017, 19:10

» [GAME] What are you thinking right now?
by Van-Helsing Sat 09 Dec 2017, 14:51

» Widget : Similar topics
by ranbac Wed 06 Dec 2017, 18:11

» Change the Background of the Forum and put an image and how to make prefixs?
by Clement Wed 06 Dec 2017, 15:19

» Hello from Western Australia
by SarkZKalie Wed 06 Dec 2017, 05:34

Recent Tutorials
Top posting users this month

Who is online?
In total there are 13 users online :: 0 Registered, 0 Hidden and 13 Guests

None

[ View the whole list ]


Most users ever online was 515 on Tue 14 Sep 2021, 15:24

Complex form of New Topic Function

Page 1 of 3 1, 2, 3  Next

View previous topic View next topic Go down

Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Tue 21 Jun 2016, 10:29

Hello,

So on my forum i have installed a javascript where by adding an image link to the description it makes it an image and views it to the topics preview list. Now some members don't know that and doesn't matter how many times i tell them how to do that they seem not to understand at all.

So basically what i want is a simple form that will be activated once you press the New Topic button in the News Forum.

That form will include a Title field (that will be filled i guess automatically afterwards) and the title prefixes next to that so they can select the correct prefix, an Image field where members will add the link of the image for the topic and then the image will be placed in the description field of the topic and added to the topic also and the News Text where members will add the text of the news they found.

I will give you an example so you guys understand better what i want.

Here we are:
Complex form of New Topic Function 086a3b7fe7e04b90adea4e7f7a4d63c4

These are the main 4 fields i want to be shown. So you add a title for your topic, it adds it there. You select a Prefix it adds it (based on my codes i already have there), then you add an image just once, and it adds the image as a link to the description field and then as an image
Code:
[img]URL[/img]
to the editor and a last field that would be a text zone for the news text.

Once they edit that the Send button will glow and then they can post the topic.


Will that be easy to create?
The forum is:
http://www.informationforumgr.com
version is phpBB3.

Thanks for any help.
Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Wed 22 Jun 2016, 13:28

Bump

Some information i forgot:
This has to work on specific categories and not for every category. So if this is done automatically via js or has to be in the HTML page then works for me. Smile

Thanks again!
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12004
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Thu 23 Jun 2016, 09:01

Hey,

So if I got this right, all you really need is for the script to add an image to the text editor when placed in the description and only work in specific forums, correct ? If that's right, where would the image be placed in the editor ?
Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Thu 23 Jun 2016, 10:03

Kay so here's how the posts look:



Centered Image

Info Image (i want this to show up automatically, it's always the same)
News Text


*Source: Source Link (so maybe we'll need an other field for the source Razz )



Here's the preview of a topic:
http://prntscr.com/bk103l
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12004
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Fri 24 Jun 2016, 10:41

Hmm.. give this a try :
Code:
$(function() {
  var form = document.post;

  if (form && form.f) {
    if (form.f.value == '3' || '6' || '9') {
      if (!form.message.value) {
        form.message.value = '[center][img]INFO IMAGE[/img][/center]\n\nSOURCE : [url=SOURCE LINK]SOURCE TEXT[/url]';
      }

      form.onsubmit = function() {
        if (this.description && this.description.value) {
          if ($.sceditor && !new RegExp('[center][img]' + this.description.value + '[/img][/center]').test(this.message.value)) {
            var instance = $(form).sceditor('instance');
            instance.val('[center][img]' + this.description.value + '[/img][/center]' + instance.val());
          } else {
            this.message.value = '[center][img]' + this.description.value + '[/img][/center]' + this.message.value;
          }
        }
      };
     
    }
  }
});

Set the placement for this script to "in all the pages" and make sure to edit this part to include the forum ids you want the script to execute in :
Code:
if (form.f.value == 3 || 6 || 9)

Basically it should add a small form to the message area, and when you submit the topic ( either by submit or preview ) it'll add the image from the description to the message. Let me know if it works for you.

Another alternative is you can insert a text template into the message area, and then when you submit the topic it'll remove the template labels, and parse the template values.
Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Fri 24 Jun 2016, 12:44

@Ange Tuteur can this be added in a html page as well? And i mean have a form design like the image on top appearing when the new topic button is pressed?

What i want basically is when you press a new topic to have a new form instead of the normal type of editor and have those input fields there that will be recognized as the title, the prefix, the description, message and the other info i added above. Is that easy to do? I mean i can create the page entirely and have it ready but i don't know how to make the inputs to be like i want it to be... Sad

This is what i made but i can't make it work with js..
http://prntscr.com/bklf0c

code i used:
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12004
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Mon 27 Jun 2016, 09:56

Well, yes, it is possible. What you need to do is bind an event to a button, so when you click it, it get's the values of all your custom fields and compiles them into a single string which is entered into the message area. Usually :
Code:
<textarea name="message"></textarea>
or you could use AJAX to post the topic instead, it depends.

Sooo, I'd recommend adding an id to each custom field so you can get the value of those fields easily. Something like this :
Code:
Name : <input type="text" id="name"/>

Then JS to get the field's value would look like this :
Code:
var name = document.getElementById('name').value;

After that you just need to compile everything into a single string. You might want to use this ( It's a modified version of the graphic form I made, although you might already have this ) as a reference, because it's a great example of what you're trying to achieve. Specifically :
Code:
          case 1 :
            for (var data = getId('stepData-1').getElementsByTagName('INPUT'), i = 0, j = data.length, pass = true; i<j; i++) {
              if (data[i].name == 'creType' && data[i].value == 0) {
                getId('stepData-1').getElementsByTagName('SELECT')[0].style.borderColor = '#E53';
                pass = false;
              }
              if (!data[i].value) {
                if (data[i].name == 'creType' || data[i].name == 'creURL' || data[i].name == 'creSize' || data[i].name == 'creRules' || data[i].name == 'creText') {
                  data[i].style.borderColor = '#E53';
                  pass = false;
                } else data[i].value = 'N/A';
              }
            }
            if (!pass) return alert('Merci de remplir tous les champs obligatoires');
            var content = '[h3]En bref...[/h3]\n[color=#3399CC][b]Nature de la création :[/b][/color] ' + form.creType.value + '\n[color=#333333][b]Taille de la création (en pixels) :[/b][/color] ' + form.creSize.value + '\n[color=#3399CC][b]Couleur de fond :[/b][/color] ' + form.primaryColors.value + '\n\n[h3]Image(s)[/h3]\n[color=#3399CC][b]Lien(s) image(s) :[/b][/color]' + form.creImages.value.replace(/(https?:\/\/\S+)/gi,'\n\n[url]$1[/url]\n[spoiler="Visualiser"][img]$1[/img][/spoiler]') + '\n\n[h3]Texte[/h3]\n[color=#333333][b]Texte à insérer :[/b][/color] ' + form.creText.value + '\n[color=#3399CC][b]Police à utiliser :[/b][/color] ' + form.creFont.value + '\n[color=#333333][b]Couleur police :[/b][/color] ' + form.creFontColor.value + '\n\n[h3]En détails...[/h3]\n[color=#3399CC][b]Lien de mon forum Forumactif :[/b][/color] ' + form.creURL.value + '\n[color=#333333][b]Commentaire(s) supplémentaire(s) :[/b][/color] ' + form.desc.value;
            form.content.value = content;
            break;
Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Mon 27 Jun 2016, 17:04

I do have a different name to all of them. I could add the same id's to the inputs and do that. But how do i create the script. That part you gave me it's kind of confusing to me the way it is.. :S
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12004
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Mon 27 Jun 2016, 17:29

Try focusing on this part :
Code:
var content = '[h3]En bref...[/h3]\n[color=#3399CC][b]Nature de la création :[/b][/color] ' + form.creType.value + '\n[color=#333333][b]Taille de la création (en pixels) :[/b][/color] ' + form.creSize.value + '\n[color=#3399CC][b]Couleur de fond :[/b][/color] ' + form.primaryColors.value + '\n\n[h3]Image(s)[/h3]\n[color=#3399CC][b]Lien(s) image(s) :[/b][/color]' + form.creImages.value.replace(/(https?:\/\/\S+)/gi,'\n\n[url]$1[/url]\n[spoiler="Visualiser"][img]$1[/img][/spoiler]') + '\n\n[h3]Texte[/h3]\n[color=#333333][b]Texte à insérer :[/b][/color] ' + form.creText.value + '\n[color=#3399CC][b]Police à utiliser :[/b][/color] ' + form.creFont.value + '\n[color=#333333][b]Couleur police :[/b][/color] ' + form.creFontColor.value + '\n\n[h3]En détails...[/h3]\n[color=#3399CC][b]Lien de mon forum Forumactif :[/b][/color] ' + form.creURL.value + '\n[color=#333333][b]Commentaire(s) supplémentaire(s) :[/b][/color] ' + form.desc.value;

The content above this variable mostly checks if certain fields are valid. Basically the above variable is the content that will be inserted as the message. You'll see that it consists of values from multiple different fields. This string will later be added as the message content.


So for example we have this button :
Code:
<input type="submit" id="submitForm" value="Submit"/>

And the JavaScript for compiling all the data from your fields when it's clicked :
Code:
document.getElementById('submitForm').onclick = function() {
  var content = 'Field 1 : ' + document.getElementById('field1').value + '\nField 2 : ' + document.getElementById('field2').value + '\netc...';
};
Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Mon 27 Jun 2016, 17:33

Okay so my remaining question is how this function of the script starts. I mean i can't really copy that code because it makes my mind dizzy.. :S

I am soooo noob on JavaScript..
Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Mon 27 Jun 2016, 17:47

I mean the code of the Graphic request form.. Razz
lol not that small bit.. hehe
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12004
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Mon 27 Jun 2016, 17:47

Start with a blank function like this :
Code:
document.getElementById('MY_ID').onclick = function() {

};
You're going to want this function to be executed when a specific element is clicked, so place that element's ID where MY_ID is.

After that you can define a string by concatenating the values of your fields together. Like this :
Code:
var message = 'value 1' + 'value 2' + 'value 3';
You use the "+" operator to connect the strings and values together. I have strings above, but you can do the same with the values of elements. As long as it's a string you can concatenate them together.

Giving you something like this :
Code:
document.getElementById('MY_ID').onclick = function() {
  var message = 'value 1' + 'value 2' + 'value 3';
};

What you do with that string afterwards is up to you. If the original textarea is available you can add this variable's string as its value, or you can submit a topic via AJAX with "message" as the message content. Think
Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Mon 27 Jun 2016, 17:51

Okay this is understood and then how am i supposed to make them be posted and to the section they have to be? Think

This is why i basically get confused.. Because in this code i can only do that for one category. But i want this in multiple ones. i have to create like 15 new hmtl pages for each category?

I did do this now:
Spoiler:

I added the ids and made the script content as i want it to be.
Now for the title, the prefix and the description? How are we going to make them as we want them to be?

Title: document.getElementById('Title').value
Prefix: document.getElementById('prefixes').value
Description: document.getElementById('imgdesc').value

But where and how am i supposed to make them fill the fields automatically. And how is the content going to be placed in the editor of the new topic to post it.? OMG so difficult and i am taking too much of your time..
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12004
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Tue 28 Jun 2016, 09:43

Since you want to use this form for multiple forums, I'd suggest creating a select field. Each option will have the forum's name as the innerText and the value will be the forum id. For example :
Code:
<select id="forumSelect">
  <option value="1">Forum 1</option>
  <option value="2">Forum 2</option>
  <option value="3">Forum 3</option>
</select>
Once you get this up all you need to do is manage the form submission.



If you want the fields to be mandatory I'd suggest performing a conditional check to make sure the value has been filled. Sooo, your script would look like this in that case :
Code:
document.getElementById('MY_ID').onclick = function() {
  var message = '',
      title = document.getElementById('Title'),
      prefix = document.getElementById('prefixes'),
      desc = document.getElementById('imgdesc'),
      err = '';

  if (!title.value) err += 'Please fill in the title';
  if (!prefix.value) err += '\nPlease select a prefix.';
  if (!desc.value) err += '\nPlease fill in the description.';

  if (err) {
    alert(err);
    return;
  } else {
    message = 'something';
    // other stuff..
  }
};


Last but not least, you can submit a topic via AJAX like this :
Code:
$.post('/post', {
      subject : 'topic title',
  description : 'topic desc',
      message : 'message content',
    post_icon : 0, // topic icon
        mode : 'newtopic',
            f : 1, // forum id
        post : 1
}, function(d) {
  console.log('posted');
  // stuff that needs to be done after the topic is posted should be done here
});
All you need to do is replace the strings with your variables or values from your fields.

it should be placed near the end, like this for example :
Code:
document.getElementById('MY_ID').onclick = function() {
  var message = '',
      title = document.getElementById('Title'),
      prefix = document.getElementById('prefixes'),
      desc = document.getElementById('imgdesc'),
      err = '';

  if (!title.value) err += 'Please fill in the title';
  if (!prefix.value) err += '\nPlease select a prefix.';
  if (!desc.value) err += '\nPlease fill in the description.';

  if (err) {
    alert(err);
    return;
  } else {
    message = 'something';

    $.post('/post', {
          subject : 'topic title',
      description : 'topic desc',
          message : 'message content',
        post_icon : 0, // topic icon
            mode : 'newtopic',
                f : 1, // forum id
            post : 1
    }, function(d) {
      console.log('posted');
    });
  }
};
Just make sure "Unauthorize unofficial forms to post messages and private messages on the forum" is disabled under General > Security. Otherwise it wont work.


Don't worry about it, I'll try to answer whenever I'm free. Wink
jessy
jessy

Gender : Female
Posts : 102
Points : 3101
Reputation : 14
Language : italy
Browser : Browser : Google Chrome Forum Version : Forum Version : Invision
http://ilgiornaledibordo.forumattivo.com/

Postjessy Tue 28 Jun 2016, 13:48

interessan ,You can explain how to add Embarassed Thank you very much!
Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Wed 29 Jun 2016, 04:33

@Ange Tuteur i used this and i tested it to the forum id /f3-forum to try it out if it works but the button wont send the message... Sad

Here's what i use:
Code:
<select id="forumSelect">
  <option value="1">Forum 1</option>
  <option value="2">Forum 2</option>
  <option value="3">Forum 3</option>
</select>
<div style="width:200px;font-size:14px;display:inline-block;text-align:right">Title of the topic ::</div>
  <input type="text" name="title" id="Title" placeholder="Title" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" />
    <select id="prefixes" name="tags4" onchange="tagprefixo()"><option value="">Χωρίς θέμα</option><option value="announcement">ΑΝΑΚΟΙΝΩΣΗ</option><option value="request">ΑΙΤΗΜΑ</option><option value="idea">ΙΔΕΑ</option><option value="problem">ΠΡΟΒΛΗΜΑ</option><option value="help">ΒΟΗΘΕΙΑ</option><option value="hallo">ΝΕΟ ΜΕΛΟΣ</option><option value="ΕΛΛΑΔΑ ">ΕΛΛΑΔΑ</option><option value="ΚΟΣΜΟΣ ">ΚΟΣΜΟΣ</option><option value="ΑΘΛΗΤΙΚΑ ">ΑΘΛΗΤΙΚΑ</option><option value="ΠΕΡΙΕΡΓΑ ">ΠΕΡΙΕΡΓΑ</option><option value="FACEBOOK ">FACEBOOK</option><option value="ΤΕΧΝΟΛΟΓΙΑ ">ΤΕΧΝΟΛΟΓΙΑ</option><option value="SMARTPHONES ">SMARTPHONES</option><option value="tutorial">ΟΔΗΓΟΣ</option><option value="portablee">PORTABLE</option><option value="DOWNLOAD ">DOWNLOAD</option><option value="phhs">PHOTOSHOP</option><option value="musicccc">ΜΟΥΣΙΚΗ</option><option value="ΠΑΙΧΝΙΔΙΑ ">ΠΑΙΧΝΙΔΙΑ</option><option value="movies">ΤΑΙΝΙΑ</option><option value="spam">SPAM</option><option value="votespolls">ΨΗΦΟΦΟΡΙΑ</option><option value="school">ΣΧΟΛΕΙΟ</option><option value="advert">ΔΙΑΦΗΜΙΣΗ</option><option value="vips">VIP</option><option value="ΥΓΕΙΑ ">ΥΓΕΙΑ</option><option value="tipsadvices">TIPS - ΣΥΜΒΟΥΛΕΣ</option><option value="soscall">ΚΛΗΣΕΙΣ SOS</option><option value="cooking">ΜΑΓΕΙΡΙΚΗ</option><option value="weather">ΚΑΙΡΟΣ</option><option value="staff">STAFF</option><option value="inprogress">ΣΕ ΕΞΕΛΙΞΗ</option><option value="solved">ΛΥΘΗΚΕ</option><option value="archieved">ΚΑΔΟΣ</option></select> <br /><br />
<div style="width:200px;font-size:14px;text-align:right;display:inline-block;">Image of the topic ::</div>
  <input type="text" id="imgdesc" name="imgdesc" placeholder="Image URL" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />
<div style="width:200px;font-size:14px;text-align:right;display:inline-block;">The text of the topic ::</div>
  <input type="text" id="textmsg" name="textmsg" placeholder="News Text" style="width: 600px;height: 150px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />
<div style="width:200px;font-size:14px;text-align:right;display:inline-block;">The topic's source link ::</div>
  <input type="text" id="srxlink" name="srclink" placeholder="Source Link" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />
<div style="width:200px;font-size:14px;display:inline-block;text-align:right">The topic's source name ::</div>
  <input type="text" id="srcname" name="srcname" placeholder="Source Name" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />

<br /><BR /><BR />
<input type="submit" id="submitForm" value="Submit"/>


<script type="text/javascript">

document.getElementById('submitForm').onclick = function() {
  var message = '',
      title = document.getElementById('Title'),
      prefix = document.getElementById('prefixes'),
      desc = document.getElementById('imgdesc'),
      err = '';
 
  if (!title.value) err += 'Please fill in the title';
  if (!prefix.value) err += '\nPlease select a prefix.';
  if (!desc.value) err += '\nPlease fill in the description.';
 
  if (err) {
    alert(err);
    return;
  } else {
    message = '[center][img]' + document.getElementById('imgdesc').value + '[/img]\n\n[img]http://i68.servimg.com/u/f68/18/45/97/69/ei310.png[/img][/center]\n[I-F-GR]' + document.getElementById('textmsg').value + '\n\n\n\n[color=green][b]* Πηγή:[/b][/color] [url=' + document.getElementById('srclink').value + ']' + document.getElementById('srcname').value + '[/url][/I-F-GR]';
    // other stuff..
  }
};
</script>
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12004
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Wed 29 Jun 2016, 08:46

Did you submit the topic via AJAX ? I don't see any forms or the required post() function.. Think

Look at the AJAX portion of my post. I provide the method for submitting the topic + an example of where the post() function should go. If you can't figure that part out let me know and I'll give you another example using your above markup.
Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Wed 29 Jun 2016, 08:56

I did just update the code with this one:
Code:
<select id="forumSelect">
  <option value="1">Forum 1</option>
  <option value="2">Forum 2</option>
  <option value="3">Forum 3</option>
</select>
<div style="width:200px;font-size:14px;display:inline-block;text-align:right">Title of the topic ::</div>
  <input type="text" name="title" id="Title" placeholder="Title" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" />
    <select id="prefixes" name="tags4" onchange="tagprefixo()"><option value="">Χωρίς θέμα</option><option value="announcement">ΑΝΑΚΟΙΝΩΣΗ</option><option value="request">ΑΙΤΗΜΑ</option><option value="idea">ΙΔΕΑ</option><option value="problem">ΠΡΟΒΛΗΜΑ</option><option value="help">ΒΟΗΘΕΙΑ</option><option value="hallo">ΝΕΟ ΜΕΛΟΣ</option><option value="ΕΛΛΑΔΑ ">ΕΛΛΑΔΑ</option><option value="ΚΟΣΜΟΣ ">ΚΟΣΜΟΣ</option><option value="ΑΘΛΗΤΙΚΑ ">ΑΘΛΗΤΙΚΑ</option><option value="ΠΕΡΙΕΡΓΑ ">ΠΕΡΙΕΡΓΑ</option><option value="FACEBOOK ">FACEBOOK</option><option value="ΤΕΧΝΟΛΟΓΙΑ ">ΤΕΧΝΟΛΟΓΙΑ</option><option value="SMARTPHONES ">SMARTPHONES</option><option value="tutorial">ΟΔΗΓΟΣ</option><option value="portablee">PORTABLE</option><option value="DOWNLOAD ">DOWNLOAD</option><option value="phhs">PHOTOSHOP</option><option value="musicccc">ΜΟΥΣΙΚΗ</option><option value="ΠΑΙΧΝΙΔΙΑ ">ΠΑΙΧΝΙΔΙΑ</option><option value="movies">ΤΑΙΝΙΑ</option><option value="spam">SPAM</option><option value="votespolls">ΨΗΦΟΦΟΡΙΑ</option><option value="school">ΣΧΟΛΕΙΟ</option><option value="advert">ΔΙΑΦΗΜΙΣΗ</option><option value="vips">VIP</option><option value="ΥΓΕΙΑ ">ΥΓΕΙΑ</option><option value="tipsadvices">TIPS - ΣΥΜΒΟΥΛΕΣ</option><option value="soscall">ΚΛΗΣΕΙΣ SOS</option><option value="cooking">ΜΑΓΕΙΡΙΚΗ</option><option value="weather">ΚΑΙΡΟΣ</option><option value="staff">STAFF</option><option value="inprogress">ΣΕ ΕΞΕΛΙΞΗ</option><option value="solved">ΛΥΘΗΚΕ</option><option value="archieved">ΚΑΔΟΣ</option></select> <br /><br />
<div style="width:200px;font-size:14px;text-align:right;display:inline-block;">Image of the topic ::</div>
  <input type="text" id="imgdesc" name="imgdesc" placeholder="Image URL" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />
<div style="width:200px;font-size:14px;text-align:right;display:inline-block;">The text of the topic ::</div>
  <input type="text" id="textmsg" name="textmsg" placeholder="News Text" style="width: 600px;height: 150px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />
<div style="width:200px;font-size:14px;text-align:right;display:inline-block;">The topic's source link ::</div>
  <input type="text" id="srxlink" name="srclink" placeholder="Source Link" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />
<div style="width:200px;font-size:14px;display:inline-block;text-align:right">The topic's source name ::</div>
  <input type="text" id="srcname" name="srcname" placeholder="Source Name" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />

<br /><BR /><BR />
<input type="submit" id="submitForm" value="Submit"/>


<script type="text/javascript">

document.getElementById('submitForm').onclick = function() {
  var message = '',
      title = document.getElementById('Title'),
      prefix = document.getElementById('prefixes'),
      desc = document.getElementById('imgdesc'),
      err = '';
 
  if (!title.value) err += 'Please fill in the title';
  if (!prefix.value) err += '\nPlease select a prefix.';
  if (!desc.value) err += '\nPlease fill in the description.';
 
  if (err) {
    alert(err);
    return;
  } else {
    message = 'something';
 
    $.post('/post', {
          subject : 'topic title',
      description : 'topic desc',
          message : 'message content',
        post_icon : 0, // topic icon
            mode : 'newtopic',
                f : 1, // forum id
            post : 1
    }, function(d) {
      console.log('posted');
    });
  }
};
</script>
Still nothing happened.. Sad
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12004
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Fri 01 Jul 2016, 10:42

This is a complete example using all the fields you provided :
Code:
<select id="forumSelect">
  <option value="1">Forum 1</option>
  <option value="2">Forum 2</option>
  <option value="3">Forum 3</option>
</select>
<div style="width:200px;font-size:14px;display:inline-block;text-align:right">Title of the topic ::</div>
  <input type="text" name="title" id="Title" placeholder="Title" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" />
    <select id="prefixes" name="tags4" onchange="tagprefixo()"><option value="">Χωρίς θέμα</option><option value="announcement">ΑΝΑΚΟΙΝΩΣΗ</option><option value="request">ΑΙΤΗΜΑ</option><option value="idea">ΙΔΕΑ</option><option value="problem">ΠΡΟΒΛΗΜΑ</option><option value="help">ΒΟΗΘΕΙΑ</option><option value="hallo">ΝΕΟ ΜΕΛΟΣ</option><option value="ΕΛΛΑΔΑ ">ΕΛΛΑΔΑ</option><option value="ΚΟΣΜΟΣ ">ΚΟΣΜΟΣ</option><option value="ΑΘΛΗΤΙΚΑ ">ΑΘΛΗΤΙΚΑ</option><option value="ΠΕΡΙΕΡΓΑ ">ΠΕΡΙΕΡΓΑ</option><option value="FACEBOOK ">FACEBOOK</option><option value="ΤΕΧΝΟΛΟΓΙΑ ">ΤΕΧΝΟΛΟΓΙΑ</option><option value="SMARTPHONES ">SMARTPHONES</option><option value="tutorial">ΟΔΗΓΟΣ</option><option value="portablee">PORTABLE</option><option value="DOWNLOAD ">DOWNLOAD</option><option value="phhs">PHOTOSHOP</option><option value="musicccc">ΜΟΥΣΙΚΗ</option><option value="ΠΑΙΧΝΙΔΙΑ ">ΠΑΙΧΝΙΔΙΑ</option><option value="movies">ΤΑΙΝΙΑ</option><option value="spam">SPAM</option><option value="votespolls">ΨΗΦΟΦΟΡΙΑ</option><option value="school">ΣΧΟΛΕΙΟ</option><option value="advert">ΔΙΑΦΗΜΙΣΗ</option><option value="vips">VIP</option><option value="ΥΓΕΙΑ ">ΥΓΕΙΑ</option><option value="tipsadvices">TIPS - ΣΥΜΒΟΥΛΕΣ</option><option value="soscall">ΚΛΗΣΕΙΣ SOS</option><option value="cooking">ΜΑΓΕΙΡΙΚΗ</option><option value="weather">ΚΑΙΡΟΣ</option><option value="staff">STAFF</option><option value="inprogress">ΣΕ ΕΞΕΛΙΞΗ</option><option value="solved">ΛΥΘΗΚΕ</option><option value="archieved">ΚΑΔΟΣ</option></select> <br /><br />
<div style="width:200px;font-size:14px;text-align:right;display:inline-block;">Image of the topic ::</div>
  <input type="text" id="imgdesc" name="imgdesc" placeholder="Image URL" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />
<div style="width:200px;font-size:14px;text-align:right;display:inline-block;">The text of the topic ::</div>
  <input type="text" id="textmsg" name="textmsg" placeholder="News Text" style="width: 600px;height: 150px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />
<div style="width:200px;font-size:14px;text-align:right;display:inline-block;">The topic's source link ::</div>
  <input type="text" id="srxlink" name="srclink" placeholder="Source Link" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />
<div style="width:200px;font-size:14px;display:inline-block;text-align:right">The topic's source name ::</div>
  <input type="text" id="srcname" name="srcname" placeholder="Source Name" style="width: 600px;height: 25px;border-radius: 3px;font-size: 13px!important;border: 1px solid #ccc;" /><br /><br />
 
<br /><BR /><BR />
<input type="submit" id="submitForm" value="Submit"/>
 
 
<script type="text/javascript">
 
document.getElementById('submitForm').onclick = function() {
  var message = '',
      title = document.getElementById('Title'),
      prefix = document.getElementById('prefixes'),
      desc = document.getElementById('imgdesc'),
      msg = document.getElementById('textmsg'),
      srclink = document.getElementById('srxlink'),
      srcname = document.getElementById('srcname'),
      forum = document.getElementById('forumSelect'),
      err = '';
 
  if (!title.value) err += 'Please fill in the title';
  if (!prefix.value) err += '\\nPlease select a prefix.';
  if (!desc.value) err += '\\nPlease fill in the description.';
  if (!msg.value) err += '\\nPlease fill in the message.';
  if (!srclink.value) err += '\\nPlease fill in the source link.';
  if (!srcname.value) err += '\\nPlease fill in the source name.';
  if (!forum.value) err += '\\nPlease select a forum.';
 
  if (err) {
    alert(err);
    return;
  } else {
    $.post('/post', {
          subject : '[' + prefix.value + '] ' + title.value,
      description : desc.value,
          message : '[center][img]' + desc.value + '[/img][/center]\\n' + msg.value + '\\nSource : [url=' + srclink.value + ']' + srcname.value + '[/url]',
            mode : 'newtopic',
                f : forum.value, // forum id
            post : 1
    }, function(d) {
      alert('Your topic has been posted.');
      window.location.href = $('a[href^="/viewtopic?t="]', d).attr('href');
    });
  }
};
</script>

Make sure that :
1. "Unauthorize unofficial forms to post messages and private messages on the forum" is disabled under General > Security.
2. You're using your forum's header and footer for the HTML page OR you have the jQuery library in your HTML page if you're not using your forum's header and footer.
Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Sat 02 Jul 2016, 06:50

This does work now!! Yay.. Now how can i set the forums i selected to use this form, once they press the new topic to redirect them to the hmtl page instead of the new topic form?

EDIT: Thanks Ange. I'll leave this a couple of days and if i get any problems i'll let your know.. Wink


Last edited by Luffy on Sun 03 Jul 2016, 18:33; edited 1 time in total
BlackScorpion
BlackScorpion
Valued Member
Gender : Male
Posts : 1165
Points : 4951
Reputation : 96
Location : USA
Language : english
Browser : Browser : Google Chrome Forum Version : Forum Version : Other
http://themechanger.forumotion.com https://pinterest.com/blkscorpion2

PostBlackScorpion Sat 02 Jul 2016, 22:49

Man Luffy, that site is all "GREEK" to me..
Luffy
Luffy

Gender : Male
Age : 29
Posts : 291
Points : 4009
Reputation : 64
Language : Greek, English
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB3
https://www.inforumgr.com/ https://www.facebook.com/inforumgr https://twitter.com/inforumgr

PostLuffy Sun 03 Jul 2016, 14:37

Hahaha @BlackScorpion, it's in Greek man what do you expect!! lol lol!
jessy
jessy

Gender : Female
Posts : 102
Points : 3101
Reputation : 14
Language : italy
Browser : Browser : Google Chrome Forum Version : Forum Version : Invision
http://ilgiornaledibordo.forumattivo.com/

Postjessy Mon 04 Jul 2016, 14:44

jessy wrote:interessan ,You can explain how to add Embarassed Thank you very much!
Complex form of New Topic Function 1f60d
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12004
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Tue 05 Jul 2016, 09:39

@Luffy okay, you're welcome. Wink

@Jessy to be frank, if you do not understand the basics of HTML, CSS, or JavaScript I cannot help you with this.
jessy
jessy

Gender : Female
Posts : 102
Points : 3101
Reputation : 14
Language : italy
Browser : Browser : Google Chrome Forum Version : Forum Version : Invision
http://ilgiornaledibordo.forumattivo.com/

Postjessy Tue 05 Jul 2016, 17:44

OK thank you very much Complex form of New Topic Function 1f339
Sponsored content

PostSponsored content

Page 1 of 3 1, 2, 3  Next

View previous topic View next topic Back to top

Create an account or log in to leave a reply

You need to be a member in order to leave a reply.

Create an account

Join our community by creating a new account. It's easy!


Create a new account

Log in

Already have an account? No problem, log in here.


Log in

 
Permissions in this forum:
You cannot reply to topics in this forum