Base solution for your next web application
Open Closed

Looking to increase the size of a create and edit modal through defined css classes #10085


User avatar
0
dev1_premierpoint created

Using Asp.Net Core MVC+ Jquery and Metronic.

I am looking to give more room when inside one of the create and edit modals, and I would like to try and just increase the size of the modal before I resort to using the documentation to convert the modal to a full mvc page.

I'm going to look through the metronic documentation to see if I can find an example there.

Any help in pointing the right would be appreciated, whether it be in the metronic stuff or an example in the aspnet zero examples.


4 Answer(s)
  • User Avatar
    1
    ismcagdas created
    Support Team

    Hi,

    You can use one of the sizes explained here

  • User Avatar
    0
    dev1_premierpoint created

    While those different sizes do work (ismcagdas), the CreateAndEditModal partial pages are used, so the only part of the modal that is editable is the modal body and everything inside of that. I have found the partial for the header and footer, but I'm not sure where to find the outermost layer of the dialog is set up and how I can change that for just this create modal.

    In other words, the div that I can edit the classes of is the modal with class modal-body, but when the page loads, it is wrapped inside of the div with classes modal-dialog and modal-lg. I'm not sure where to find where this is put together, and I am afraid that wouldn't resolve my issue even if I did find it since I do not want to change that for every modal that uses the same predefined code.

  • User Avatar
    1
    ismcagdas created
    Support Team

    Hi,

    If I understand it correctly, you can pass the modal size to ModalManager in your javascript code as shown below;

    var _createOrEditModal = new app.ModalManager({
                viewUrl: abp.appPath + 'AppAreaName/Users/CreateOrEditModal',
                scriptUrl: abp.appPath + 'view-resources/Areas/AppAreaName/Views/Users/_CreateOrEditModal.js',
                modalClass: 'CreateOrEditUserModal',
                modalSize: 'xxx'
            });
    
  • User Avatar
    0
    dev1_premierpoint created

    That's perfect. Thanks for the help.