小编Nic*_*ger的帖子

正确打印Twitter Bootstrap

我真的很想要正确地打印我的Twitter Bootstrap视图,并且想知道是否有人能指出我正确的方向.我添加了一个自定义的"print.css",它覆盖了一些原始的bootstrap样式,以及一些自己的组件样式.

这是我的打印对话框: 在此输入图像描述

不确定你是否可以从图像中轻松地说出来,但是井已经失去了背景并且没有跨越整个页面宽度.此外,"列"或"跨度"似乎都是不稳定的.页面构建如下:(仅显示第一行以保持清洁)

<div class="container-fluid">
    <div class="row-fluid">
        <div class="span3">
            <div class="row-fluid">
                <div style="height: 150px; width: 300px">
                    <img class="img-rounded" src='data:image/png;base64,@Model.Unit.Image64' />
                </div>
            </div>

            <div class="row-fluid">
                ...
            </div>

        </div>
        <div class="span4">
            ...Pie chart control
        </div>
        <div class="span5">
            ...Bar chart control
        </div>

    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

这是我的print.css:

@media print {
    body {
        margin: 0;
        padding: 0;
        line-height: 1.4em;
        word-spacing: 1px;
        letter-spacing: 0.2px;
        font: 13px Arial, Helvetica,"Lucida Grande", serif;
        color: #000;
    }

    #print-btn #update-btn #nav-left #nav-bar, #selectUnitContainer, .navbar, .sidebar-nav {
        display: none;
    }

    #print-btn, #update-btn, …
Run Code Online (Sandbox Code Playgroud)

html css printing twitter-bootstrap

30
推荐指数
1
解决办法
9万
查看次数

根据Twitter Bootstrap中的负值,是否可以让进度条从右向左移动?

在开始这个项目之前,我想知道是否可以反转bootstrap框架中的进度条,所以它可以显示从右到左的值?这个问题背后的原因是我有一系列可以从正面到负面的数字.我们的想法是将两个进度条彼此相邻放置,右边一个显示百分比范围,当值为正时,左边栏显示百分比范围,当值为负时.目前,这些值是静态的,但这些将在未来"生存".

关于此的任何输入,如果可能的话,指向类似项目的指针?我还没有真正找到与此框架相关的任何内容.

我看过像这样的帖子:使用CSS3反向进度条,但我不确定这是否是使用Bootstrap时的方法.对于css,是否有某种覆盖可用于此类功能?

现在,我的进度条设置如下:

        <li>Speed<span class="pull-right"><em>@Math.Round(DepthValue, 2) m/min</em></span>
            <div class="progress progress-success">
                <div class="bar" style="width: @Model.SpeedRangePercentage%"></div>
            </div>
        </li>
Run Code Online (Sandbox Code Playgroud)

css twitter-bootstrap progress-bar

8
推荐指数
4
解决办法
1万
查看次数

我应该考虑使用SignalR而不是WCF双工服务吗?

我正在开发这个项目,其中有一个网站通过远程服务器上的wcf双工服务"实时"获取数据.更新的频率约为一秒,我使用SignalR客户端来更新视图.(每次有来自服务的传入"数据包",我都会通知我的客户).

目前,由于双工服务的工作方式,我遇到了此解决方案的一些问题.每当与后端服务器没有"实时"连接时,它就会向数据库提供最新的数据库条目.这是有效的,但我的客户看来似乎没有正确地接受这一点.如果我尝试刷新视图,它实际上是随机更新的值.(调试时,值都在notify-methods中)

我已经尝试使用jquery/ajax在我的控制器中调用一个方法来设置这样的连接:

setTimeout(function() {

        $.ajax({
            type: 'GET',
            url: '@Url.Action("ConnectToDataSources", "Fleet")', 
            cache: false,
            success: function (result) {

            }
        });
}, 1000)
Run Code Online (Sandbox Code Playgroud)

在我的控制器中:

public void ConnectToDataSources()
{
    UnitContract[] listOfUnitsFromService = UnitClient.GetUnits(false, "", false);

    Model = new FleetModel
    {
        UnitDetails = GenerateUnitDetails(listOfUnitsFromService.ToList()),
    };

    foreach (UnitDetailsModel unit in Model.UnitDetails)
    {
        var ods = new OperationDataSource();
        var ads = new ActivityStatusDataSource();

        ads.Start(unit.UnitId, ActivityReceived, AliveReceived);
        ods.Start(DataReceived, unit.UnitId);
        _dataSources.Add(ods);
        _activityStatusDataSources.Add(ads);
    }
}
Run Code Online (Sandbox Code Playgroud)

经过大量的反复试验后,我考虑将后端服务改为使用SignalR.我是否正确理解SignalR实际上可以取代我在服务器和客户端上面描述的功能?

此外,如果有人有相同的设置我很高兴听到你如何解决这个问题:)

.net c# asp.net wcf signalr

8
推荐指数
1
解决办法
3100
查看次数

webpack-dev-server缓存问题

我在运行webpack-dev-server时遇到了一些问题.每当我保存文件并编译更改时,它们都不会反映在浏览器中.(命令行没有错误)

我正在运行以下命令:

webpack-dev-server --progress --color

但是,如果我webpack每次更改都会运行,这会反映在我的浏览器中.

我在我的Mac上运行的Chrome(最新v OSX的),我已经启用了"禁用缓存,而devtools是打开"选项.毋庸置疑,但是嘿 - 你永远不会知道,我的DevTools打开了.. :)

我在这里错过了一个简单的步骤吗?

javascript google-chrome webpack webpack-dev-server

6
推荐指数
1
解决办法
4442
查看次数

无法从Android模拟器连接到localhost上的wcf服务

我正在使用Xamarin Studio构建一个应该访问wcf服务的应用程序.使用以下网址从我的浏览器访问该服务正常工作: http://localhost:52277/api

每当我尝试从我的Android代码访问它时,我得到以下异常:

System.Net.WebException: Error: ConnectFailure (Connection refused) ---> System.Exception: Connection refused
  at System.Net.Sockets.Socket.Connect (System.Net.EndPoint remoteEP) [0x00000] in <filename unknown>:0
  at System.Net.WebConnection.Connect (System.Net.HttpWebRequest request) [0x00000] in <filename unknown>:0
  --- End of inner exception stack trace ---
  at System.Net.HttpWebRequest.EndGetResponse (IAsyncResult asyncResult) [0x00000] in <filename unknown>:0
  at System.Net.HttpWebRequest.GetResponse () [0x00000] in <filename unknown>:0
  at ServiceStack.ServiceClient.Web.ServiceClientBase.Send[String] (System.String httpMethod, System.String relativeOrAbsoluteUrl, System.Object request) [0x00051] in c:\Users\nicklas.winger\Documents\GitHub\ServiceStack\src\ServiceStack.Common\ServiceClient.Web\ServiceClientBase.cs:896
Run Code Online (Sandbox Code Playgroud)

我正在IIS Express上运行该服务,并且我已经修改了我的iis applicationhost.config(根据pluralsight的一个课程,从bindingInformation中删除'localhost'):

<site name="ProteinTrackerMvc" id="45">
    <application path="/" applicationPool="Clr4IntegratedAppPool">
        <virtualDirectory path="/" physicalPath="c:\users\nicklas.winger\documents\visual studio 2012\Projects\ProteinTrackerMvc\ProteinTrackerMvc" />
    </application>
    <bindings> …
Run Code Online (Sandbox Code Playgroud)

c# iis wcf android iis-express

5
推荐指数
1
解决办法
5541
查看次数

是否存在基于Semantic UI框架构建的asp.net mvc 4模板?

我知道Twitter bootstrap在创建一个新项目时有几个用mvc 4滚动的模板,但是有一个使用Semantic UI吗?谷歌搜索与我的相关性很小,在VS2012中的在线模板中搜索时,我也无法找到任何搜索.

asp.net-mvc frameworks css-frameworks asp.net-mvc-4 semantic-ui

5
推荐指数
1
解决办法
1741
查看次数

如何更改dropzone.js中的默认文本?

我无法更改dropzone上传器的默认文本.尽管事实上我已经像这样初始化它,它仍然呈现默认文本:

Dropzone.options.imgUpload = {
    paramName: "file", // Must match the name of the HttpPostedFileBase argument that the Upload action expects.
    dictDefaultMessage: "Drag your image here",
    acceptedFiles: "image/*" // Accept images only
};
Run Code Online (Sandbox Code Playgroud)

还尝试更改dropzone.js中设置的dictDefaultMessage,但没有运气:(顺便说一下;我应该使用两者还是删除其中一个?

有什么建议?

javascript dropzone.js

5
推荐指数
1
解决办法
2万
查看次数

基于SignalR输入连续更新d3图表中的行

我有一个显示三行的d3图表,其中每一行都有自己的y轴.它还有一个用于显示时间的x轴.所有轴都有缩放/平移. 在此输入图像描述 这适用于显示历史数据,但我还需要一个按钮来开始显示实时数据.

我有一个按钮触发SignalR,它再次给我新的数据,我可以推送到我的数据阵列.

我的问题是,每次使用新数据值更新数组时,我如何更新这三行并在水平方向上移动它们.我已经尝试过这个指南了,但我最终要做的就是重新绘制旧线之上的整条线.(我现在只想更新其中一个)

在显示我的图表代码之前,我应该提到我的数组每秒都会使用新值更新(这发生在一个单独的js文件中,包含在同一个视图中):

speed.push(entry.Speed);
redraw();

<script>
    /* d3 vars */
    var graph;
    var m = [];
    var w;
    var h;

    /* d3 scales */
    var x;
    var y1;
    var y2;
    var y3;

    /* d3 axes */
    var xAxis;
    var yAxisLeft;
    var yAxisLeftLeft;
    var yAxisRight;

    /* d3 lines */
    var line1;
    var line2;
    var line3;

    /* d3 zoom */
    var zoom;
    var zoomLeftLeft;
    var zoomRight;

    /* Data */
    var speed = [];
    var depth = …
Run Code Online (Sandbox Code Playgroud)

javascript d3.js signalr

5
推荐指数
1
解决办法
848
查看次数

使用jquery/javascript更改Kendo网格中的行颜色

我有一个显示警报列表的ajax绑定网格.基于行对象中的某些条件,我需要更改行的颜色.这之前,当我的网格是服务器绑定时(我知道这是它应该工作的方式),但由于更改,网格需要使用ajax更新.这是我的网格,以及服务器绑定时的工作原理(注意我已更改为.Ajax():

@(Html.Kendo().Grid(Model.Alarms)
      .Name("grid")
      .DataSource(dataSource => dataSource
          .Ajax()
                  .ServerOperation(false)
                  .Model(m => m.Id(s => s.AlarmComment))
                  .Read(read => read.Action("Alarms_Read", "Alarms", new { id = Model.ViewUnitContract.Id }).Type(HttpVerbs.Get))
                  .AutoSync(true)
                  .ServerOperation(true)
      )
      .RowAction(row =>
      {
          if (row.DataItem.DateOff == null && row.DataItem.DateAck == null)
          {
              row.HtmlAttributes["style"] = "backgrcolor:red";
          }
          if (row.DataItem.DateOff != null && row.DataItem.DateAck == null)
          {
              row.HtmlAttributes["style"] = "color: green";
          }
          if (row.DataItem.DateOff == null && row.DataItem.DateAck != null)
          {
              row.HtmlAttributes["style"] = "color: blue";
          }
      })
      .Columns(col =>
      {
          col.Bound(p => p.DateOn).Format("{0:u}").Title("Date");
          col.Bound(p …
Run Code Online (Sandbox Code Playgroud)

javascript jquery kendo-ui kendo-grid

4
推荐指数
1
解决办法
6130
查看次数

是否存在使用React hooks和Typescript定义状态的"正确"方法?

我已经和React工作了一段时间,昨天我在基于Typescript的项目中弄到了钩子.在重构之前,该类有一个这样的状态:

interface INavItemProps {
  route: IRoute;
}

interface INavItemState {
  toggleStateOpen: boolean
}

class NavItem extends Component<INavItemProps, INavItemState> {
  constructor() {
    this.state = { toggleStateOpen: false };
  }

  public handleClick = (element: React.MouseEvent<HTMLElement>) => {
    const toggleState = !this.state.toggleStateOpen;
    this.setState({ toggleStateOpen: toggleState });
  };

  ...
}
Run Code Online (Sandbox Code Playgroud)

现在,在重构功能组件时,我开始讨论这个问题

interface INavItemProps {
  route: IRoute;
}

const NavItem: React.FunctionComponent<INavItemProps> = props => {
  const [toggleState, setToggleState] = useState<boolean>(false);
  const { route } = props;

  const handleClick = (element: React.MouseEvent<HTMLElement>) => {
    const newState …
Run Code Online (Sandbox Code Playgroud)

javascript typescript reactjs react-hooks

4
推荐指数
1
解决办法
72
查看次数