Ajax Rating Control не отображается при печати с использованием JavaScript - PullRequest
Новая
       12

Ajax Rating Control не отображается при печати с использованием JavaScript

0 голосов
/ 10 октября 2018

У меня есть контроль рейтинга Ajax на моей странице aspx.Когда я печатаю страницу с помощью javascript, элемент управления рейтингом не отображается на распечатанной странице или в предварительном просмотре.У кого-нибудь есть решение для этого? Это мой тег управления рейтингом 

<ajaxToolkit:Rating ID="rtDriverRating" AutoPostBack="false" runat="server" MaxRating="5" StarCssClass="Star" WaitingStarCssClass="WaitingStar" EmptyStarCssClass="Star" FilledStarCssClass="FilledStar" ReadOnly="true"></ajaxToolkit:Rating>

Это моя функция печати Javascript: 

function printdiv(printpage) {
    var headstr = "<html><head><title></title></head><body>";
    var footstr = "</body>";
    var newstr = document.all.item(printpage).innerHTML;
    var oldstr = document.body.innerHTML;
    document.body.innerHTML = headstr + newstr + footstr;
    window.print();
    document.body.innerHTML = oldstr;
    //window.location.reload();
    return false;
}

И вот что я получаю при просмотре страницы: 

<a href="javascript:void(0)" id="ContentPlaceHolder1_rtDriverRating_A" title="5" style="text-decoration:none"><span id="ContentPlaceHolder1_rtDriverRating_Star_1" class="FilledStar" style="float:left;">&nbsp;</span><span id="ContentPlaceHolder1_rtDriverRating_Star_2" class="FilledStar" style="float:left;">&nbsp;</span><span id="ContentPlaceHolder1_rtDriverRating_Star_3" class="FilledStar" style="float:left;">&nbsp;</span><span id="ContentPlaceHolder1_rtDriverRating_Star_4" class="FilledStar" style="float:left;">&nbsp;</span><span id="ContentPlaceHolder1_rtDriverRating_Star_5" class="FilledStar" style="float:left;">&nbsp;</span></a>

Ниже показано, как отображается элемент управления рейтингом на странице Элемент управления рейтингом Ajax на странице

Редактировать: Добавление моего кода CSS: 

.Star {
    background-image: url(/Content/imgs/images/Star.gif);
    height: 17px;
    width: 17px;
}

.WaitingStar {
    background-image: url(/Content/imgs/images/WaitingStar.gif);
    height: 17px;
    width: 17px;
}

.FilledStar {
    background-image: url(/Content/imgs/images/FilledStar.gif);
    height: 17px;
    width: 17px;
}

1 Ответ

0 голосов
/ 10 октября 2018

Проблема решена.Спасибо @ nuts-n-beer за его ответ в теме Как я могу заставить браузеры печатать фоновые изображения в CSS? Это было потому, что звезды были определены как фон.Мне нужно было добавить no-repeat! Важный для свойства css background и затем включить печать фоновой графики.Это мой новый css 

.Star {
    background: url(/Content/imgs/images/Star.gif) no-repeat !important;
    height: 17px;
    width: 17px;
}

Если кто-то знает, как заставить показывать изображения без пользователя, включите печать фоновой графики, я буду очень признателен.

...