Как спроектировать модальный контроллер представления, используя InnerHtml? - PullRequest
Новая
       15

Как спроектировать модальный контроллер представления, используя InnerHtml?

0 голосов
/ 02 мая 2019

Код ниже - это то, что я использовал для разработки модального контроллера вида 

 innerHtml = "<div style='width:100%;height:auto;'><span>Accuracy : " + AccuracyResult + "</span> </div>";

                        if (AccuracyResult < 25) {
                            innerHtml += "<div style='width:100%;height:auto;color:Red;'><span>Unclear/Unsatisfactory recording..please try again</span></div>";
                        }
                        if (AccuracyResult > 70) {
                            innerHtml += "<div style='width:100%;height:auto;color:Green;'><span>Well done!</span></div>";
                        }

                        innerHtml += "<br/>";
                        innerHtml += "<div style='width:100%;height:auto;background-color: #F5FED6;border:1px solid #090;'>";
                        innerHtml += "<div style='width:100%;height:auto;'><span>Source file : </span></div>";
                        innerHtml += "<div style='width:100%;height:auto;'><img src='data:image/png;base64," + EncodedSourceSpectrum + "' style='width:515px;height:200px;'/></div>";
                        innerHtml += "</div>";
                        innerHtml += "<br/>";
                        innerHtml += "<div style='width:100%;height:auto;background-color: #F5FED6;border:1px solid #090;'>";
                        innerHtml += "<div style='width:100%;height:auto;'><span>Recorded file : </span></div>";
                        innerHtml += "<div style='width:100%;height:auto;'><img src='data:image/png;base64," + EncodedRecordedSpectrum + "' style='width:515px;height:200px;'/></div>";
                        innerHtml += "</div>";

                        $('#BaudioRecordingContainer').empty(); 
                        $("#BaudioRecordingContainer").html(innerHtml);
                        $("#BaudioRecordingContainer").addClass('modal');
                        $("#BaudioRecordingContainer").slideDown(200);      


<div id="BaudioRecordingContainer" style="top: 13%; left: 25%; width: 46%; max-height: 50%;">
    </div>

, так как использованный метод не мог вывести желаемый. Теперь я борюсь с тем, что мне нужно добавить часть заголовка и схему для модальности. Когда я попытался добавить 


                        innerhtml +="<div class='ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix'><span class='ui-dialog-title' id='ui-id-1'>Audio Comparison</span><a class='ui-dialog-titlebar-close ui-corner-all' role='button' href='#'><span class='ui-icon ui-icon-closethick'>close</span></a></div>";

модал не выскакивает?

...