简体   繁体   中英

Bootstrap 3.3 modal with jQuery load and return value

The latest version of Bootstrap modal options says that remote function is deprecated and will be removed in Bootstrap 4. So i'm trying to load a page with jQuery load. But how does this work? I can't find any example of this.

What I want is a modal that loads a page that I created as well. When you click a link in that page (the link is an url of an image), the href value must be returned to the textbox (ImageUrl) in the parent page.

<div class="input-group">
    @Html.EditorFor(model => model.ImageUrl, new { htmlAttributes = new { @class = "form-control" } })
        <span class="input-group-btn">
            <button class="btn btn-default browsefiles" type="button" data-toggle="modal" data-target="#myModal"><i class="fa fa-search"></i></button>
        </span>
</div>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Image</h4>
            </div>
            <div class="modal-body">
                External page must be loaded here
            </div>                            
        </div>
    </div>
</div>

I didn't knew that jQuery.load returned only html and that it will paste the html in the div that you have specified. So when you want to "return" something, the destination is on the same page. So you could set the return value directly in the page.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM