Using one modal for multiple forms in django?

Question

I can't figure out how to use one modal for multiple forms.

Now, I can not find a way to have only one modal for severals form that I want to create. I don't really want to have 30 modals in the html for the 30 forms that I am going to submit.

Is there another way to fill it automatically?

My model is

class Project(models.Model):

    project_name = models.CharField(max_length=30)
    project_status = models.IntegerField(choices=PROJECT_STATUS,default=1)
    project_sponsor = models.CharField('Project Sponsor', 
    max_length=255,default=1)
    scope = models.TextField(max_length=10240, blank=True)
    description = models.TextField(max_length=10240, blank=True)

Then, I wanted to have one form for each model attribute. For example, I would like to have a form for description, then another one for scope...

class ScopeForm(forms.ModelForm):
    def __init__(self, *args, **kwargs):
        super(ScopeForm, self).__init__(*args, **kwargs)
        for field in self.fields:
            self.fields[field].required = False

    class Meta:
        model = Project
        fields = ['project_scope',]


class DescriptionForm(forms.ModelForm):
    def __init__(self, *args, **kwargs):
        super(DescriptionForm, self).__init__(*args, **kwargs)
        for field in self.fields:
            self.fields[field].required = False

    class Meta:
        model = Project
        fields = ['description',]

In my html file, I am using a modal to submit the form

<a href="#" data-toggle="modal" data-target="#purpose">Purpose</br></a>

<div class="modal fade" id="purpose" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
  <div class="modal-dialog">
 <div class="modal-content">
  <div class="modal-header">
   <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
   <h3 class="modal-title" id="lineModalLabel">Purpose</h3>
  </div>
  <div class="modal-body">
   <form>
              <div class="form-group">
                <label>
                The Purpose will provide a brief overview of the purpose of the project and provide enough of a description to complete
                the following sections. If information to complete the following sections is not available, state that it is unavailable and
                state the person accountable and schedule for completion. </label>                
              </div>
              <div class="form-group" "width: 300px" "height: 100px" "border: 1px solid blue">
                <label for="purpose">Purpose</label>
                <textarea id="txtCommentHere" class="form-control" rows="3" id="purpose" placeholder="Purpose">
                </textarea>
              </div>              
              <div class="checkbox">
                <label>
                  <input type="checkbox"> Draft                                     
                </label></br>
                <label>
                  <input type="checkbox"> In Progress           
                </label>
                
              </div>
              <button type="submit" class="btn btn-default">Submit</button>
            </form>

  </div>
    </div>
   </div>
</div>

Possible duplicate of [Passing data to a bootstrap modal](http://stackoverflow.com/questions/10626885/passing-data-to-a-bootstrap-modal) — Selcuk, May 22 '17 at 01:25

score 0 · Answer 1 · answered May 22 '17 at 06:03

0

You could check out this in bootstrap documentation Bootstrap (Many to 1) Modal

Basically you need to pass the data via js/jquery to modal.

answered May 22 '17 at 06:03

Ashwin

562
6
14

Using one modal for multiple forms in django?

1 Answers1